來源于 https://segmentfault.com/a/1190000002634958

?

內(nèi)置對象與原生對象

內(nèi)置（Build-in）對象與原生（Naitve）對象的區(qū)別在于：前者總是在引擎初始化階段就被創(chuàng)建好的對象，是后者的一個(gè)子集；而后者包括了一些在運(yùn)行過程中動態(tài)創(chuàng)建的對象。

原生對象（New后的對象）

ECMA-262?把原生對象（native object）定義為“獨(dú)立于宿主環(huán)境的?ECMAScript?實(shí)現(xiàn)提供的對象”。包括如下：

Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError、ActiveXObject(服務(wù)器方面)、Enumerator(集合遍歷類)、RegExp（正則表達(dá)式）

由此可以看出，簡單來說，原生對象就是?ECMA-262?定義的類（引用類型）。

來源：?http://es5.github.com/#x4.3.6

內(nèi)置對象（不需要New）

定義：由ECMAScript實(shí)現(xiàn)提供的對象，獨(dú)立于宿主環(huán)境，在一個(gè)腳本程序執(zhí)行的開始處。

注：每個(gè)內(nèi)置對象(built-in object)都是原生對象（Native Object），一個(gè)內(nèi)置的構(gòu)造函數(shù)是一個(gè)內(nèi)置的對象，也是一個(gè)構(gòu)造函數(shù)。

來源：http://es5.github.io/#x4.3.7

舉個(gè)栗子：

Native objects: Object (constructor), Date, Math, parseInt, eval。 string 方法比如 indexOf 和 replace, array 方法, ... Host objects (假定是瀏覽器環(huán)境): window, document, location, history, XMLHttpRequest, setTimeout, getElementsByTagName, querySelectorAll, ...

ECMA-262][2?只定義了兩個(gè)新的內(nèi)置對象，即?Global?和?Math?（它們也是原生對象，根據(jù)定義，每個(gè)內(nèi)置對象都是原生對象）。

以下是ECMA-262定義的內(nèi)置對象（built-in）：

global、Object、Function、Array、String、Boolean、Number、Math、Date、RegExp、JSON、Error對象（Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError 和URIError）

我們也可以修改內(nèi)置對象的原型

if (!Array.prototype.forEach) { Array.prototype.forEach = function(fn){ for ( var i = 0; i < this.length; i++ ) { fn( this[i], i, this ); } }; } ["a", "b", "c"].forEach(function(value, index, array){ assert( value, "Is in position " + index + " out of " + (array.length - 1) ); });

以上代碼將輸出：

PASS Is in position 0 out of 2 PASS Is in position 1 out of 2 PASS Is in position 2 out of 2

注意：擴(kuò)展原型是很危險(xiǎn)的：

Object.prototype.keys = function(){ var keys = []; for ( var i in this ) keys.push( i ); return keys; }; var obj = { a: 1, b: 2, c: 3 }; assert( obj.keys().length == 3, "We should only have 3 properties." ); delete Object.prototype.keys;

輸出：?FAIL We should only have 3 properties.

如果不是有特殊需要而去擴(kuò)展原生對象和原型（prototype）的做法是不好的

//不要這樣做 Array.prototype.map = function() { // code };

除非這樣做是值得的，例如，向一些舊的瀏覽器中添加一些ECMAScript5中的方法。?
在這種情況下，我們一般這樣做：

<script type="text/javascript"> if (!Array.prototype.map) { Array.prototype.map = function() { //code }; } </script>

用原型擴(kuò)展對象

對js原生對象的擴(kuò)展無非就是往prototype里注冊，例如，我們可以往String對象里擴(kuò)展ltrim,rtrim等方法。js每個(gè)對象都繼承自O(shè)bject，并且，對象和其他屬性都通過prototype對象來繼承。通過prototype對象，我們可以擴(kuò)展任何對象，包括內(nèi)建的對象，如String和Date：

String對象的擴(kuò)展

<script type="text/javascript"> if(typeof String.prototype.ltrim=='undefined'){ String.prototype.ltrim = function(){ var s = this; s = s.replace(/^\s*/g, ''); return s; } } if(typeof String.prototype.rtrim=='undefined'){ String.prototype.rtrim = function(){ var s = this; s = s.replace(/\s*$/g, ''); return s; } } if(typeof String.prototype.trim=='undefined'){ String.prototype.trim = function(){ return this.ltrim().rtrim(); } } if(typeof String.prototype.htmlEncode=='undefined'){ String.prototype.htmlEncode = function(encodeNewLine){//encodeNewLine:是否encode換行符 var s = this; s = s.replace(/&/g, '&amp;'); s = s.replace(/</g, '&lt;'); s = s.replace(/>/g, '&gt;'); s = s.replace(/'/g, '&quot;'); if(encodeNewLine){ s = s.replace(/\r\n/g, '<br />'); s = s.replace(/\r/g, '<br />'); s = s.replace(/\n/g, '<br />'); } return s; } } </script>

Date對象的擴(kuò)展

getDaysInMonth：獲取某月有多少天

Date.getDaysInMonth = function (year, month) { var days = 0; switch (month) { case 1: case 3: case 5: case 7: case 8: case 10: case 12: days = 31 break; case 4: case 6: case 9: case 11: days = 30; break; case 2: if (year % 400 == 0 || (year % 4 == 0 && year % 100 != 0)) days = 29; else days = 28; break; } return days; } if (typeof Date.prototype.format == 'undefined') { Date.prototype.format = function (mask) { var d = this; var zeroize = function (value, length) { if (!length) length = 2; value = String(value); for (var i = 0, zeros = ''; i < (length - value.length); i++) { zeros += '0'; } return zeros + value; }; return mask.replace(/"[^"]*"|'[^']*'|\b(?:d{1,4}|m{1,4}|yy(?:yy)?|([hHMstT])\1?|[lLZ])\b/g, function ($0) { switch ($0) { case 'd': return d.getDate(); case 'dd': return zeroize(d.getDate()); case 'ddd': return ['Sun', 'Mon', 'Tue', 'Wed', 'Thr', 'Fri', 'Sat'][d.getDay()]; case 'dddd': return ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'][d.getDay()]; case 'M': return d.getMonth() + 1; case 'MM': return zeroize(d.getMonth() + 1); case 'MMM': return ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][d.getMonth()]; case 'MMMM': return ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'][d.getMonth()]; case 'yy': return String(d.getFullYear()).substr(2); case 'yyyy': return d.getFullYear(); case 'h': return d.getHours() % 12 || 12; case 'hh': return zeroize(d.getHours() % 12 || 12); case 'H': return d.getHours(); case 'HH': return zeroize(d.getHours()); case 'm': return d.getMinutes(); case 'mm': return zeroize(d.getMinutes()); case 's': return d.getSeconds(); case 'ss': return zeroize(d.getSeconds()); case 'l': return zeroize(d.getMilliseconds(), 3); case 'L': var m = d.getMilliseconds(); if (m > 99) m = Math.round(m / 10); return zeroize(m); case 'tt': return d.getHours() < 12 ? 'am' : 'pm'; case 'TT': return d.getHours() < 12 ? 'AM' : 'PM'; case 'Z': return d.toUTCString().match(/[A-Z]+$/); // Return quoted strings with the surrounding quotes removed default: return $0.substr(1, $0.length - 2); } }); }; }

使用原生js實(shí)現(xiàn)復(fù)制對象及擴(kuò)展

jQuery的extend()方法能很方便的實(shí)現(xiàn)擴(kuò)展對象方法，這里要實(shí)現(xiàn)的是：使用原生js實(shí)現(xiàn)復(fù)制對象，擴(kuò)展對象，類似jQuery中的extend()方法

var obj1 = {name : 'trigkit4',age : 22 }; var obj2 = { name : 'frank', age : 21, speak : function(){ alert("hi, I'm + name "); } }; var obj3 ={ age : 20 }; function cloneObj(oldObj) { //復(fù)制對象方法 if (typeof(oldObj) != 'object') return oldObj; if (oldObj == null) return oldObj; var newObj = Object(); for (var i in oldObj) newObj[i] = cloneObj(oldObj[i]); return newObj; } function extendObj() { //擴(kuò)展對象 var args = arguments;//將傳遞過來的參數(shù)數(shù)組賦值給args變量 if (args.length < 2) return; var temp = cloneObj(args[0]); //調(diào)用復(fù)制對象方法 for (var n = 1; n < args.length; n++) { for (var i in args[n]) { temp[i] = args[n][i]; } } return temp; } var obj =extendObj(obj1,obj2,obj3); console.log(obj);//{ name: 'frank', age: 20, speak: [Function] } console.log(obj1);//{ name: 'trigkit4', age: 22 } console.log(obj2);//{ name: 'frank', age: 21, speak: [Function] } console.log(obj3);//{ age: 20 }

es5-safe 模塊

es5-safe?模塊里，僅擴(kuò)展了可以較好實(shí)現(xiàn)的可以安全使用的部分方法，包括：

Function.prototype.bind Object.create Object.keys Array.isArray Array.prototype.forEach Array.prototype.map Array.prototype.filter Array.prototype.every Array.prototype.some Array.prototype.reduce Array.prototype.reduceRight Array.prototype.indexOf Array.prototype.lastIndexOf String.prototype.trim Date.now

詳情：http://es5.github.io/

對象的創(chuàng)建

JavaScript?支持四種類型的對象：內(nèi)部對象、生成的對象、宿主給出的對象（如 Internet 瀏覽器中的?window?和?document）以及?ActiveX?對象（外部組件）。

Microsoft Jscript?提供了 11 個(gè)內(nèi)部（或“內(nèi)置”）對象。它們是Array、Boolean、Date、Function、Global、Math、Number、Object、RegExp、Error?以及?String?對象。每一個(gè)對象有相關(guān)的方法和屬性，

JavaScript中對象的創(chuàng)建有以下幾種方式：

（1）使用內(nèi)置對象 （2）使用JSON符號 （3）自定義對象構(gòu)造

一、使用內(nèi)置對象

JavaScript可用的內(nèi)置對象可分為兩種：1，JavaScript語言原生對象（語言級對象），如String、Object、Function等； 2，JavaScript運(yùn)行期的宿主對象（環(huán)境宿主級對象），如window、document、body等。

內(nèi)置對象列表

Array Boolean Date Error EvalError Function Infinity JSON Map Math NaN Number Object ParallelArray Promise Proxy RegExp Set String Symbol SyntaxError Uint32Array WeakSet decodeURI decodeURIComponent() encodeURI() encodeURIComponent() escape()已廢棄 eval() isFinite() isNaN() null parseFloat parseInt undefined

以上資料來源于：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects#.E5.9F.BA.E6.9C.AC.E5.AF.B9.E8.B1.A1

自定義對象構(gòu)造

創(chuàng)建高級對象構(gòu)造有兩種方式：使用“this”關(guān)鍵字構(gòu)造、使用原型prototype構(gòu)造

Date對象

get系列方法

getDate() 從 Date 對象返回一個(gè)月中的某一天 (1 ~ 31)。 getDay() 從 Date 對象返回一周中的某一天 (0 ~ 6)。 getMonth() 從 Date 對象返回月份 (0 ~ 11)。 getFullYear() 從 Date 對象以四位數(shù)字返回年份。注意不要使用getYear()。 getHours() 返回 Date 對象的小時(shí) (0 ~ 23)。 getMinutes() 返回 Date 對象的分鐘 (0 ~ 59)。 getSeconds() 返回 Date 對象的秒數(shù) (0 ~ 59)。 getMilliseconds() 返回 Date 對象的毫秒(0 ~ 999)。 getTime() 返回 1970 年 1 月 1 日至今的毫秒數(shù)。 getTimezoneOffset() 返回本地時(shí)間與格林威治標(biāo)準(zhǔn)時(shí)間 (GMT) 的分鐘差。 getUTCDate() 根據(jù)世界時(shí)從 Date 對象返回月中的一天 (1 ~ 31)。 getUTCDay() 根據(jù)世界時(shí)從 Date 對象返回周中的一天 (0 ~ 6)。 getUTCMonth() 根據(jù)世界時(shí)從 Date 對象返回月份 (0 ~ 11)。 getUTCFullYear() 根據(jù)世界時(shí)從 Date 對象返回四位數(shù)的年份。 getUTCHours() 根據(jù)世界時(shí)返回 Date 對象的小時(shí) (0 ~ 23)。 getUTCMinutes() 根據(jù)世界時(shí)返回 Date 對象的分鐘 (0 ~ 59)。 getUTCSeconds() 根據(jù)世界時(shí)返回 Date 對象的秒鐘 (0 ~ 59)。 getUTCMilliseconds() 根據(jù)世界時(shí)返回 Date 對象的毫秒(0 ~ 999)。

set系列方法

setDate() 設(shè)置 Date 對象中月的某一天 (1 ~ 31)。 setMonth() 設(shè)置 Date 對象中月份 (0 ~ 11)。 setFullYear() 設(shè)置 Date 對象中的年份（四位數(shù)字）。注意不要使用setYear()方法。 setHours() 設(shè)置 Date 對象中的小時(shí) (0 ~ 23)。 setMinutes() 設(shè)置 Date 對象中的分鐘 (0 ~ 59)。 setSeconds() 設(shè)置 Date 對象中的秒鐘 (0 ~ 59)。 setMilliseconds() 設(shè)置 Date 對象中的毫秒 (0 ~ 999)。 setTime() 以毫秒設(shè)置 Date 對象。 setUTCDate() 根據(jù)世界時(shí)設(shè)置 Date 對象中月份的一天 (1 ~ 31)。 setUTCMonth() 根據(jù)世界時(shí)設(shè)置 Date 對象中的月份 (0 ~ 11)。 setUTCFullYear() 根據(jù)世界時(shí)設(shè)置 Date 對象中的年份（四位數(shù)字）。 setUTCHours() 根據(jù)世界時(shí)設(shè)置 Date 對象中的小時(shí) (0 ~ 23)。 setUTCMinutes() 根據(jù)世界時(shí)設(shè)置 Date 對象中的分鐘 (0 ~ 59)。 setUTCSeconds() 根據(jù)世界時(shí)設(shè)置 Date 對象中的秒鐘 (0 ~ 59)。 setUTCMilliseconds() 根據(jù)世界時(shí)設(shè)置 Date 對象中的毫秒 (0 ~ 999)。

toString系列方法

toString() 把 Date 對象轉(zhuǎn)換為字符串，toString()總是返回一個(gè)用美式英語表達(dá)的字符串。 toTimeString() 把 Date 對象的時(shí)間部分轉(zhuǎn)換為字符串。 toDateString() 把 Date 對象的日期部分轉(zhuǎn)換為字符串。 toUTCString() 根據(jù)世界時(shí)，把 Date 對象轉(zhuǎn)換為字符串。 toLocaleString() 根據(jù)本地時(shí)間格式，把 Date 對象轉(zhuǎn)換為字符串。 toLocaleTimeString() 根據(jù)本地時(shí)間格式，把 Date 對象的時(shí)間部分轉(zhuǎn)換為字符串。 toLocaleDateString() 根據(jù)本地時(shí)間格式，把 Date 對象的日期部分轉(zhuǎn)換為字符串。

Array對象

屬性

constructor指定創(chuàng)建對象原型的函數(shù)。index如果數(shù)組是通過正則表達(dá)式匹配創(chuàng)建的，比配是字符串的下標(biāo)索引為0.input如果數(shù)組是通過正則表達(dá)式匹配創(chuàng)建的，返回原始的字符串。 length長度返回?cái)?shù)組中元素個(gè)數(shù).prototype允許為所有對象附加屬性.

方法

這些方法可以改變數(shù)組自身:

pop移除數(shù)組的最后一個(gè)元素，返回值是被刪除的元素。push在數(shù)組的末尾添加一個(gè)或者多個(gè)元素，返回值是新的數(shù)組的長度。reverse顛倒數(shù)組中元素的順序，原先第一個(gè)元素現(xiàn)在變成最后一個(gè)，同樣原先的最后一個(gè)元素變成了現(xiàn)在的第一個(gè)，也就是數(shù)組的索引發(fā)生了變化。shift刪除數(shù)組的第一個(gè)元素，返回值是刪除的元素。sort 對數(shù)組中的元素進(jìn)行排序。 splice 添加或刪除數(shù)組中的一個(gè)或多個(gè)元素。 unshift 添加一個(gè)或者多個(gè)元素在數(shù)組的開頭，返回值是新的數(shù)組的長度。

Accessor 方法

這些過程不改變數(shù)組自身

concat返回一個(gè)包含此數(shù)組和其他數(shù)組和/或值的結(jié)合的新數(shù)組 indexOf返回第一個(gè)與給定參數(shù)相等的數(shù)組元素的索引，沒有找到則返回-1。 join將所有的數(shù)組元素連接成一個(gè)字符串。lastIndexOf返回在數(shù)組中搜索到的與給定參數(shù)相等的元素的最后（最大）索引。slice返回?cái)?shù)組中的一段。toSourceReturns an array literal representing the specified array; you can use this value to create a new array. Overrides the Object.toSource method. toString 返回代表該數(shù)組及其元素的字符,重寫Object.toString 過程. valueOf Returns the primitive value of the array. Overrides the Object.valueOf method.

循環(huán)（迭代）過程

filter對數(shù)組中的每一個(gè)元素調(diào)用參數(shù)中指定的過濾函數(shù)，并將對于過濾函數(shù)返回值為true的那些數(shù)組元素集合為新的數(shù)組返回。forEach對數(shù)組的每一個(gè)元素依次調(diào)用參數(shù)中指定的函數(shù)。every如果數(shù)組中每一個(gè)元素都滿足參數(shù)中提供的測試函數(shù)，則返回真。mapCreates a new array with the results of calling a provided function on every element in this array. some 如果數(shù)組中至少有一個(gè)元素滿足參數(shù)函數(shù)的測試，則返回true。

總結(jié)：

改變原數(shù)組的方法：pop()、push()、reverse()、shift()、sort()、splice()、unshift() 不改變原數(shù)組的方法：concat()、join()、slice()、toString()

Boolean

屬性

Boolean.length長度屬性,值為1. Boolean.prototype代表Boolean構(gòu)造器的原型.

方法

Boolean.prototype.toSource() Boolean.prototype.toString() Boolean.prototype.valueOf()

String 對象

屬性

String.length String.prototype

方法：

charAt() 方法可返回指定位置的字符。stringObject.charAt(index)charCodeAt() 方法可返回指定位置的字符的 Unicode 編碼。這個(gè)返回值是 0 – 65535 之間的整數(shù)。 stringObject.charCodeAt(index)concat() 方法用于連接兩個(gè)或多個(gè)字符串。 stringObject.concat(stringX, stringX, …, stringX)indexOf() 方法可返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置。 stringObject.indexOf(searchvalue, fromindex)lastIndexOf() 方法可返回一個(gè)指定的字符串值最后出現(xiàn)的位置，在一個(gè)字符串中的指定位置從后向前搜索。localeCompare()：用本地特定的順序來比較兩個(gè)字符串stringObject.localeCompare(target)match() 方法可在字符串內(nèi)檢索指定的值，或找到一個(gè)或多個(gè)正則表達(dá)式的匹配。 該方法類似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。 stringObject.match(regexp)replace() 方法用于在字符串中用一些字符替換另一些字符，或替換一個(gè)與正則表達(dá)式匹配的子串。stringObject.replace(regexp/substr, replacement) search() 方法用于檢索字符串中指定的子字符串，或檢索與正則表達(dá)式相匹配的子字符串。 stringObject.search(regexp) slice() 方法可提取字符串的某個(gè)部分，并以新的字符串返回被提取的部分。 stringObject.slice(start, end) substring()不推薦使用，建議使用slice()替代。 substr()不推薦使用，建議使用slice()替代。 toLocaleLowerCase()不推薦使用，只在土耳其語等少數(shù)語種中有用，建議使用toLowerCase()替代。 toLocaleUpperCase()不推薦使用，只在土耳其語等少數(shù)語種中有用，建議使用toUpperCase()替代。 toLowerCase() 方法用于把字符串轉(zhuǎn)換為小寫。 toUpperCase() 方法用于把字符串轉(zhuǎn)換為大寫。

注意：String?對象的方法?slice()、substring()?和?substr()?都可返回字符串的指定部分。強(qiáng)烈建議在所有場合都使用?slice()方法。

RegExp對象

屬性

RegExp.prototype.constructor創(chuàng)建該正則對象的構(gòu)造函數(shù)。RegExp.prototype.global是否開啟全局匹配，也就是匹配目標(biāo)字符串中所有可能的匹配項(xiàng)，而不是只進(jìn)行第一次匹配。RegExp.prototype.ignoreCase在匹配字符串時(shí)是否要忽略字符的大小寫。RegExp.prototype.lastIndex 下次匹配開始的字符串索引位置。 RegExp.prototype.multiline 是否開啟多行模式匹配（影響 ^ 和 $ 的行為） RegExp.prototype.source 正則對象的源模式文本。

方法

RegExp.prototype.exec()在目標(biāo)字符串中執(zhí)行一次正則匹配操作。RegExp.prototype.test()測試當(dāng)前正則是否能匹配目標(biāo)字符串。RegExp.prototype.toString()返回一個(gè)字符串，其值為該正則對象的字面量形式。覆蓋了Object.prototype.toString() 方法。

Object對象

當(dāng)以非構(gòu)造函數(shù)形式被調(diào)用時(shí)，Object?等同于?new Object()。

屬性或方法

Object的每個(gè)實(shí)例都具有共同的基本屬性和方法

屬性或者方法說明

constructor	指向創(chuàng)建當(dāng)前對象的構(gòu)造函數(shù)
hasOwnProperty(name)	檢測給定屬性name在實(shí)例對象（不是原型對象）中是否存在。name以字符串形式指定
isPropertyOf(object)	檢測傳入的對象object是否該方法調(diào)用者的原型對象。一般格式：Class.prototype.isPropertyOf(object)
propertyIsEnumerable(pr)	檢測屬性pr能否用for-in循環(huán)枚舉。屬性pro用字符串形式指定
toLocaleString()	返回對象的字符串表示。與地區(qū)和環(huán)境對應(yīng)
toString()	返回對象的字符串表示
valueOf()	返回對象的字符串、數(shù)值或布爾值表示

靜態(tài)方法

Object.create(prototype, descriptors) 以指定的原型創(chuàng)建對象，并且可以（可選）的設(shè)置對象的屬性Object.defineProperty(object, propertyname, descriptor) 對指定的對象的一個(gè)屬性設(shè)置豐富的值控制Object.defineProperties(object, descriptors) 對指定的對象的一組屬性提供豐富的值控制 Object.getOwnPropertyDescriptor(object, propertyname) 返回屬性的定義 Object.getOwnPropertyNames(object) 返回所有屬性的名稱，哪怕說是不能枚舉的屬性 Object.preventExtensions(object) 防止新的屬性添加到對象 Object.isExtensible(object) 是否可添加屬性到對象 Object.seal(object) 阻止向指定對象添加新屬性或刪除現(xiàn)有屬性 Object.freeze(object) 防止現(xiàn)有屬性和屬性值的修改，并防止新特性的添加。 Object.isFrozen(object) 檢查當(dāng)前對象是否已凍結(jié) Object.getPrototypeOf(object) 返回指定對象的原型

全局屬性和方法

全局方法

全局屬性

轉(zhuǎn)載于:https://www.cnblogs.com/ys-wuhan/p/6772636.html

總結(jié)

以上是生活随笔為你收集整理的JavaScript原生对象及扩展的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。