原文:JavaScript Object對(duì)象

Object對(duì)象

1. 介紹

　　Object對(duì)象，是所有JavaScript對(duì)象的超類(基類)。Object.prototype(Obecjt的原型)定義了Js對(duì)象的基本方法和屬性。

2. 構(gòu)造函數(shù)

2.1 new Object() ：返回一個(gè)Object實(shí)例

2.2 new Object(value) ：根據(jù)value的值，返回不同的對(duì)象(Number、Boolean、String)

參數(shù)：

①value {number | bool | string} ：一個(gè)數(shù)字、布爾值或者字符串

返回值：

{Number、Boolean、String} 返回一個(gè)轉(zhuǎn)換后的對(duì)象

示例 ：

var o = new Object(123); console.log(o); // => Number對(duì)象 o = new Object(true); console.log(o); // => Boolean對(duì)象 o = new Object('abc'); console.log(o); // => String對(duì)象

?

3. 實(shí)例屬性

3.1?__proto__ ：設(shè)置或返回對(duì)象的原型對(duì)象(IE中不支持此屬性)

說明：

1) 賦值時(shí)，對(duì)象繼承新原型的所有方法和屬性，以及新原型的原型鏈中的所有方法和屬性。

2) 屬性名稱以兩個(gè)下劃線開始和結(jié)束。

3) 對(duì)象的__proto__ == 對(duì)象類的prototype

示例：

// 1.自定義對(duì)象多層繼承 function People(name) {this.name = name; }function Student(age) {this.age = age; } Student.prototype = new People(); // 設(shè)置Student的原型為People對(duì)象var s = new Student(22); console.log(s.__proto__); // => People 對(duì)象 console.log(Student.prototype); // => People 對(duì)象 console.log(s.__proto__ == Student.prototype); // => true// 2.對(duì)象直接量 var p = {}; // 等于new Object() console.log(p.__proto__ == Object.prototype); // => true

?

3.2?prototype ：設(shè)置或返回對(duì)象類的原型對(duì)象

說明：

1) prototype為對(duì)象類的屬性。__proto__是對(duì)象的屬性。

2) ?Js內(nèi)置對(duì)象(Array、Date等對(duì)象)都有一個(gè)只讀的prototype屬性。 可將屬性和方法添加到原型中，但不能為內(nèi)置對(duì)象分配其他原型。

3) 自定義對(duì)象的prototype屬性可進(jìn)行讀寫操作。

示例：

var Student = function (name) {this.name = name; }; // 給Student的原型添加一個(gè)sayHello方法 Student.prototype.sayHello = function () {alert('Hello,' + this.name); } var st = new Student('張三'); // 初始化對(duì)象st console.log(st.name); // => 張三 st.sayHello(); // 彈出：Hello,張三

?

3.3 constructor?：表示創(chuàng)建此對(duì)象的構(gòu)造函數(shù)

說明：

1) 設(shè)置或返回創(chuàng)建此對(duì)象的構(gòu)造函數(shù)。

2) 若一個(gè)對(duì)象有多層繼承，將返回最先調(diào)用的構(gòu)造函數(shù)。

3) obj.constructor.prototype 可表示對(duì)象的原型。

示例：

// 1.內(nèi)置對(duì)象 var str = 'abc'; console.log(str.constructor); // => function String 構(gòu)造函數(shù) var o = {}; console.log(o.constructor); // => function Object 構(gòu)造函數(shù)// 2.自定義對(duì)象多層繼承 ：constructor返回最先調(diào)用的構(gòu)造函數(shù) function People(name) {this.name = name; // s對(duì)象初始化時(shí)，先調(diào)用People構(gòu)造函數(shù)，再調(diào)用Student構(gòu)造函數(shù)console.log('People調(diào)用'); } function Student(age) {this.age = age;console.log('Student調(diào)用'); } Student.prototype = new People(); // 設(shè)置Student的原型為People對(duì)象var s = new Student(22); console.log(s.constructor); // => function People 構(gòu)造函數(shù)

?

總結(jié)：__proto__、prototype、constructor 的關(guān)系

說明：

1) 對(duì)象的__proto__ 等于 類的prototype

2) 對(duì)象的constructor 等于 類，所以obj.constructor.prototype 可表示對(duì)象的原型。

示例：

var o = {}; console.log(o.__proto__ === Object.prototype); // true ：對(duì)象的__proto__等于類的prototype console.log(o.constructor === Object); // true ：對(duì)象的constructor 等于 類 console.log(o.constructor.prototype === Object.prototype); // true ：o.constructor.prototype 可表示對(duì)象的原型。

　　

4. 實(shí)例方法

4.1?hasOwnProperty(propertyName) ：判斷對(duì)象是否擁有一個(gè)指定名稱的實(shí)例屬性(非繼承)

參數(shù)：

①propertyName {string} ：屬性名稱。

返回值：

{bool} 判斷對(duì)象是否擁有一個(gè)指定名稱的本地定義(非繼承)的屬性；此方法不會(huì)檢查對(duì)象原型鏈中的屬性。

true ：屬性為對(duì)象的實(shí)例屬性，非繼承。

false ：屬性不為對(duì)象的實(shí)例屬性。

示例 ：

// 1.Object對(duì)象 var o = new Object(); o.name = '自定義屬性'; // 定義一個(gè)實(shí)例屬性 console.log(o.hasOwnProperty('name')); // => true：name屬性為實(shí)例o自己定義的，而非繼承 console.log(o.hasOwnProperty('toString')); // => false：toString為繼承屬性// 2.自定義對(duì)象 var Student = function (name) {this.name = name; }; // 給Student的原型添加一個(gè)sayHello方法 Student.prototype.sayHello = function () {alert('Hello,' + this.name); } // 給Student的原型添加一個(gè)age屬性 Student.prototype.age = '';var st = new Student('張三'); // 初始化對(duì)象st console.log(st.hasOwnProperty('name')); // => true ：調(diào)用構(gòu)造函數(shù)時(shí)，通過this.name附加到實(shí)例對(duì)象上 console.log(st.hasOwnProperty('sayHello')); // => false ：sayHello方法為原型上的成員 console.log(st.hasOwnProperty('age')); // => false ：age屬性為原型上的成員

?

4.2?isPrototypeOf(obejct) ：判斷某個(gè)原型是否出現(xiàn)在對(duì)象的原型鏈中

語法：

prototype.isPrototypeOf(object)

參數(shù)：

①obejct?{object} ：被檢測(cè)的對(duì)象。

返回值：

{bool}?返回某個(gè)原型是否出現(xiàn)在對(duì)象的原型鏈中

true ：是

false ：不是

示例 ：

// 1.Obejct對(duì)象 var o = new Object(); console.log(Object.prototype.isPrototypeOf(o)); // => true ：o為Obejct一個(gè)對(duì)象// 2.Array var array = [1, 2, 3]; console.log(Array.prototype.isPrototypeOf(array)); // => true ：數(shù)組原型 console.log(Object.prototype.isPrototypeOf(array)); // => true ：Object是所有對(duì)象的基原型// 3.自定義對(duì)象 var People = function () { } var Student = function () { } // 設(shè)置Student類的原型為People Student.prototype = new People(); var st = new Student(); console.log(Student.prototype.isPrototypeOf(st)); // => true ：st為Student一個(gè)對(duì)象 console.log(People.prototype.isPrototypeOf(st)); // => true ：Student的原型為People console.log(Object.prototype.isPrototypeOf(st)); // =>true ：Object是所有對(duì)象的基原型

?

4.3?propertyIsEnumerable(propertyName) ：判斷指定名稱的屬性是否為實(shí)例屬性并且是可枚舉的(可用for/in循環(huán)枚舉)

參數(shù)：

①propertyName?{string} ：屬性名稱

返回值：

{bool} 判斷屬性是否為實(shí)例屬性并且是可枚舉的(可用for/in循環(huán)枚舉)，不考慮原型鏈中的成員。

true ：是

false ：不是

示例 ：

// 1.Array對(duì)象 var array = [1, 2, 3]; array.name = 'Array'; console.log(array.propertyIsEnumerable('name')); // => true ：name屬性為實(shí)例屬性 console.log(array.propertyIsEnumerable('join')); // => false ：join方法繼承自Array console.log(array.propertyIsEnumerable('length')); // => false ：length屬性繼承自Array console.log(array.propertyIsEnumerable('toString')); // => false ：toString方法繼承自O(shè)bject// 2.自定義對(duì)象 var Student = function (name) {this.name = name; } // 定義一個(gè)原型方法 Student.prototype.sayHello = function () {alert('Hello' + this.name); }; var a = new Student('tom'); console.log(a.propertyIsEnumerable('name')); // => true ：name為自身定義的實(shí)例屬性 console.log(a.propertyIsEnumerable('age')); // => false ：age屬性不存在，也返回false console.log(a.propertyIsEnumerable('sayHello')); // => false ：sayHello屬于原型方法

?

4.4?toLocaleString() ：返回當(dāng)前對(duì)象的一個(gè)本地化的字符串表示

4.5?toString() ：返回當(dāng)前對(duì)象的一個(gè)字符串表示形式

4.6?valueOf() ：返回當(dāng)前對(duì)象的原始值

參數(shù)：無

返回值：

{object}?返回當(dāng)前對(duì)象關(guān)聯(lián)的原始值，若沒有相關(guān)聯(lián)的值，則返回對(duì)象本身

示例 ：

var a = [1, 2, 3]; console.log(a.valueOf()); // => [1, 2, 3]var b = true; console.log(b.valueOf()); // => truevar c = {}; console.log(c.valueOf()); // => Object {}var s = 'abc'; console.log(s.valueOf()); // => abc// 自定義個(gè)對(duì)象，重寫valueOf var customObject = {}; customObject.valueOf = function () {return '自定義對(duì)象'; } console.log(customObject.valueOf()); // => 自定義對(duì)象

?

5. 靜態(tài)方法

5.1?Object.create(prototype, propertyDescriptor)：創(chuàng)建并返回一個(gè)指定原型和指定屬性的對(duì)象

參數(shù)：

①prototype {prototype} ：返回對(duì)象的原型，可以為null。若為null，對(duì)象的原型為undefined。

②propertyDescriptor {propertyDescriptor} 可選：屬性描述符。

屬性描述符：設(shè)置屬性的一系列特性；

語法格式：

propertyName: {value: '', // 設(shè)置此屬性的值writable: true, // 設(shè)置此屬性是否可寫入；默認(rèn)為false：只讀enumerable: true, // 設(shè)置此屬性是否可枚舉(通過for/in預(yù)付)；默認(rèn)為false：不可枚舉configurable: true // 設(shè)置此屬性是否可配置；如：是否可以修改屬性的特性及刪除屬性。默認(rèn)為false }

返回值：

{object}?返回一個(gè)指定原型和指定屬性的對(duì)象

示例 ：

// 建立個(gè)自定義對(duì)象，設(shè)置name和age屬性 var obj = Object.create(null, {name: {value: 'tom',writable: true,enumerable: true,configurable: true},age: {value: 22} }); console.log(obj.name); // => tom console.log(obj.age); // => 22obj.age = 28; console.log(obj.age); // => 22 ：age屬性的writable默認(rèn)為false，此屬性為只讀for (p in obj) {console.log(p); // => name ：只輸出name屬性；age屬性的enumerable默認(rèn)為false，不能通過for/in 枚舉 }

?

5.2 ?Object.defineProperties(object, propertyDescriptor) ：添加/修改對(duì)象一個(gè)或多個(gè)屬性的特性

參數(shù)：

①object?{object} ：對(duì)象

②propertyDescriptor {propertyDescriptor} 屬性描述符。

說明：

若對(duì)象包含此屬性，則是修改此屬性的特性；否則為為對(duì)象添加此屬性。

示例 ：

var obj = {};// 為對(duì)象添加name和age屬性 Object.defineProperties(obj, {name: {value: 'tom',enumerable: true},age: {value: 22,enumerable: true } }); for (p in obj) {console.log(p); // => name、age ：輸出name和age屬性 }

　　

5.3 Object.defineProperty(obj, propertyName, propertyDescriptor) ：添加/修改對(duì)象指定屬性的特性

參數(shù)：

①object?{object} ：對(duì)象

②propertyName {string} ：屬性的名稱

③propertyDescriptor {propertyDescriptor} 屬性描述符。

說明 ：

若對(duì)象包含此屬性，則是修改此屬性的特性；否則為添加此屬性。

示例：

var obj = {}; // 添加一個(gè)name屬性 Object.defineProperty(obj, 'name', {value: 'tom',writable: true,enumerable: true,configurable:true} ); console.log(obj.name); // => tom ：輸出name屬性的value的值

?

5.4?Object.freeze(object) ：凍結(jié)對(duì)象，使其不能添加屬性以及無法對(duì)現(xiàn)有的實(shí)例屬性進(jìn)行特性更改、值修改、屬性刪除等操作

參數(shù)：

①object?{object} ：對(duì)象

說明 ：

1) 此操作不可逆，凍結(jié)后無法進(jìn)行解封。

2) 只影響實(shí)例屬性，不影響原型屬性。

示例：

var obj = {name: 'tom',age: 22 }; Object.freeze(obj); // 凍結(jié)對(duì)象obj.email = '123@qq.com'; console.log(obj.email); // undefined ：無法添加屬性 obj.age = 25; console.log(obj.age); // 22 ：無法設(shè)置屬性的值

?

5.5?Object.getOwnPropertyDescriptor(object, propertyName) ：返回對(duì)象屬性的描述符

參數(shù)：

①object?{object} ：對(duì)象

②propertyName?{propertyName} 屬性名稱

返回值：

{propertyDescriptor} 屬性描述符對(duì)象

示例 ：

var obj = {name: 'tom',age: 22 };var propertyDes = Object.getOwnPropertyDescriptor(obj, 'name'); console.log(propertyDes); // => Object {value: "tom", writable: true, enumerable: true, configurable: true} ：輸出描述符對(duì)象

　　

5.6?Object.getOwnPropertyNames(object) ：返回一個(gè)數(shù)組，包含對(duì)象的所有實(shí)例屬性和方法，不包含原型繼承的屬性和方法

參數(shù)：

①object?{object} ：對(duì)象

返回值：

{Array}?一個(gè)數(shù)組，包含對(duì)象的所有實(shí)例屬性和方法，不包含原型繼承的屬性和方法

示例 ：

var obj = {name: 'tom',age: 22,sayHello: function () {alert('Hello' + this.name);} }; console.log(Object.getOwnPropertyNames(obj)); // => ["name", "age", "sayHello"] ：返回對(duì)象的實(shí)例成員

?

5.7?Object.getPrototypeOf(object) ：返回對(duì)象的上一級(jí)原型

參數(shù)：

①object?{object} ：對(duì)象

返回值：

{object} 返回原型對(duì)象

示例 ：

// 1.對(duì)象直接量 var obj = {name: 'tom',age: 22,sayHello: function () {alert('Hello' + this.name);} }; console.log(Object.getPrototypeOf(obj)); // => Object 對(duì)象：對(duì)象直接量的原型為Object// 2.自定義對(duì)象 var People = function (name) {this.name = name; };var p = new People('tom'); var people = Object.getPrototypeOf(p); console.log(people); // => People 對(duì)象：new 創(chuàng)建的對(duì)象使用構(gòu)造函數(shù)的prototype屬性作為他們的原型 console.log(Object.getPrototypeOf(people)); // => Object 對(duì)象：原型People的原型為Object

　　

5.8?Object.isExtensible(object) ：判斷是否可向?qū)ο筇砑有碌膶傩?/h3>

5.9?Object.isFrozen(object) ：判斷對(duì)象是否凍結(jié);true：不能修改對(duì)象的現(xiàn)有屬性特性和值并且不能添加新的屬性

5.10?Object.isSealed(object) ：判斷對(duì)象是否封閉;true：不能修改對(duì)象的現(xiàn)有屬性特性并且不能添加新的屬性

?

5.11 Object.keys(object) ：返回一個(gè)數(shù)組，包含對(duì)象的可枚舉屬性和方法的名稱

參數(shù)：

①object?{object} ：對(duì)象

返回值：

{Array} 返回一個(gè)數(shù)組，包含對(duì)象的可枚舉屬性和方法的名稱

說明：

此方法與getOwnPropertyNames()類似，但getOwnPropertyNames()包含了可枚舉和不可枚舉的成員

示例 ：

var obj = {name: 'tom',age: 22,sayHello: function () {alert('Hello' + this.name);} };// 1)getOwnPropertyNames與keys方法返回的內(nèi)容都相同 console.log(Object.getOwnPropertyNames(obj)); // => ["name", "age", "sayHello"] ：返回對(duì)象的所有實(shí)例成員 console.log(Object.keys(obj)); // => ["name", "age", "sayHello"] ：返回對(duì)象的所有可枚舉成員// 設(shè)置對(duì)象的name屬性不可枚舉 Object.defineProperty(obj, 'name', {enumerable: false} );// 2)keys方法，只包含可枚舉成員 console.log(Object.getOwnPropertyNames(obj)); // => ["name", "age", "sayHello"] ：返回對(duì)象的所有實(shí)例成員 console.log(Object.keys(obj)); // => ["age", "sayHello"] ：返回對(duì)象的所有可枚舉成員

??

5.12?Object.preventExtensions(object) ：設(shè)置對(duì)象不能添加新的屬性

參數(shù)：

①object?{object} ：對(duì)象

返回值：

{object} 返回此對(duì)象

示例 ：

var obj = {name: 'tom',age: 22 }; Object.preventExtensions(obj); // 設(shè)置對(duì)象不能添加新的屬性 obj.email = '123@qq.com'; console.log(obj.email); // => undefined ：無法向?qū)ο筇砑有碌膶傩?

?

5.13?Object.seal(object) ：密封對(duì)象，使其無法修改現(xiàn)有屬性的特性以及不能添加新的屬性

參數(shù)：

①object?{object} ：對(duì)象

返回值：

{object} 返回此對(duì)象

示例 ：

var obj = {name: 'tom',age: 22 }; Object.seal(obj); // 密封對(duì)象 obj.email = '123@qq.com'; console.log(obj.email); // => undefined ：無法向?qū)ο筇砑有碌膶傩?/ 報(bào)異常：無法修改對(duì)象屬性的特性 Object.defineProperty(obj, 'name', {enumerable: false} );

?

6.屬性描述符

分為數(shù)據(jù)屬性和訪問器屬性；

兩者可相互轉(zhuǎn)換，若轉(zhuǎn)換后未設(shè)置enumerable和configurable特性(兩類屬性描述符都包含這2個(gè)特性)，將默認(rèn)采用轉(zhuǎn)換前的值。

6.1 數(shù)據(jù)屬性

說明：包含屬性的操作特性；如：設(shè)置值、是否可枚舉等等

特性名稱	描述	默認(rèn)值
value	設(shè)置屬性的值	undefined
writable	是否可修改屬性的值；true：可修改屬性的值；false：不可修改屬性的值	false
enumerable	是否可枚舉屬性；true：可枚舉，可通過for/in語句枚舉屬性；false：不可枚舉	false
configurable	是否可修改屬性的特性；true：可修改屬性的特性(如把writable從false改為true)；false：不可修改屬性的特性	false

?

?

?

?

默認(rèn)值：

1)在使用Object.defineProperty、Object.defineProperties 或 Object.create 函數(shù)的情況下添加數(shù)據(jù)屬性，writable、enumerable和configurable默認(rèn)值為false。

2)使用對(duì)象直接量創(chuàng)建的屬性，writable、enumerable和configurable特性默認(rèn)為true。

示例：

// 1)對(duì)象直接量；屬性特性默認(rèn)為true var o1 = {name: 'tom' }; console.log(Object.getOwnPropertyDescriptor(o1, 'name')); // => Object {value: "tom", writable: true, enumerable: true, configurable: true}// 2)通過Object.create創(chuàng)建，屬性特性默認(rèn)為false var o2 = Object.create(null, {name: {value:'tom'} }); console.log(Object.getOwnPropertyDescriptor(o2, 'name')); // => Object {value: "tom", writable: false, enumerable: false, configurable: false}

?

6.2?訪問器屬性

說明：設(shè)置屬性的訪問方式；set、get特性等

特性名稱	描述	默認(rèn)值
get	屬性的返回值函數(shù)	undefined
set	屬性的設(shè)置值函數(shù)；含有一個(gè)賦值參數(shù)	undefined
enumerable	是否可枚舉屬性；true：可枚舉，可通過for/in語句枚舉屬性；false：不可枚舉	false
configurable	是否可修改屬性的特性；true：可修改屬性的特性(如把writable從false改為true)；false：不可修改屬性的特性	false

?

?

?

?

示例：

var obj = {};// 添加一個(gè)屬性，并設(shè)置為訪問器屬性 Object.defineProperty(obj, "name", {get: function () {return this._name; // get和set里的變量不要使用屬性，如：屬性為name，get和set用的是_name},set: function (x) {if (isNaN(x)) {this._name = x;} else {this._name = 'name不能為純數(shù)字';}},enumerable: true,configurable: true });console.log(Object.getOwnPropertyDescriptor(obj, 'name')); // => Object {get: function, set: function, enumerable: true, configurable: true} obj.name = '12'; console.log(obj.name); // => name不能為純數(shù)字

?

==================================系列文章==========================================

本篇文章：3.7 JavaScript?Object對(duì)象

Web開發(fā)之路系列文章

總結(jié)

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

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