干货总结:
1、对象的属性的类型有两种:数据属性和访问器属性,其中数据属性:configurable、enumerable、writable 和 value;访问器属性:configurable、enumerable、get函数和 set函数。
2、 数据属性可以直接定义,访问器属性不能直接定义,必须使用Object.defineProperty()
来定义,同时也可以用Object.defineProperty()
来修改数值属性的默认特性;在调用Object.defineProperty()
方法时,如果不指定,configurable、enumerable 和 writable 特性的默认值都是 false。
3、利用Object.defineProperties()
方法,可以通过描述符一次定义多个属性。
4、Object.getOwnPropertyDescriptor()
方法,可以取得给定属性的描述符,返回值是一个对象(传入属性的所有特性构成的对象)。
6.1理解对象
1、我们可以把 ECMAScript 的对象想象成散列表:无非就是一组名值对
,其中值可以是数据或函数。ES5中的对象是指无序的属性的集合。
2、创建自定义对象的最简单方式就是创建一个 Object 的实例
,然后再为它添加属性和方法:
var person = new Object();
person.name = "Nicholas";
person.age = 29;
person.job = "Software Engineer";
person.sayName = function(){
alert(this.name);
};
3、几年后,对象字面量
成为创建这种对象的首选模式
var person = {
name: "Nicholas",
age: 29,
job: "Software Engineer",
sayName: function(){
alert(this.name);
} }
6.1.1属性类型
对象的属性类型有两种,一种是数据属性,是数据值的保存位置;另一种是访问器属性,包含getter和setter函数。
1、数据属性
1.1 数据属性有4个描述其行为的特性。(4个描述符)
[[Configurable]]
:(可配置)表示能否删除属性(通过delete)从而重新定义属性、修改属性的特性,或者能否把属性修改为访问器属性。[[Enumerable]]
:(可枚举)表示能否通过 for-in 循环返回属性(能否遍历属性)。[[Writable]]
:(可写)表示能否修改属性的值。[[Value]]
:包含这个属性的值。读取属性值的时候,从这个位置读;写入属性值的时候,把新值保存在这个位置。这个特性的默认值为 undefined。
其中[[Configurable]]、[[Enumerable]] 、[[Writable]] ,当在像前面例子中那样直接在对象上定义的属性(字面量模式)时,它们的这个特性默认值为 true(不是直接在对象上定义的属性默认值为false)。而[[Value]] 特性被设置为指定的值。
比如:
var person = {
name: "Nicholas"
};
name 为属性名,为它指定的值是"Nicholas"。也就是说,[[Value]]特性将 被设置为"Nicholas",而对这个值的任何修改都将反映在这个位置。
1.2 修改属性的默认特性
要修改属性默认的特性,必须使用 ECMAScript 5 的Object.defineProperty()
方法()。其中,描述符(descriptor)对象的属性必须是:configurable、enumerable、writable 和 value。设置其中的一或多个值,可以修改 对应的特性值。例如:
-
把writable设置为false
这个例子创建了一个名为 name 的属性,它的值"Nicholas"是只读的。这个属性的值是不可修改的。 -
把 configurable 设置为 false,表示不能从对象中删除属性。如果对这个属性调用 delete,在严格模式下会导致错误。而且,一旦把属性定义为不可配置的, 就不能再把它变回可配置了。此时,再调用
Object.defineProperty()
方法修改除 writable 之外 的特性,都会导致错误:
var person = {};
Object.defineProperty(person, "name", {
configurable: false,
value: "Nicholas"
});
//抛出错误
Object.defineProperty(person, "name", {
configurable: true,
value: "Nicholas"
});
可以多次调用 Object.defineProperty()
方法修改同一个属性,但在把 configurable 特性设置为 false 之后就会有限制了。(其他四个特性都不能设置了)
- 注意⚠️在调用
Object.defineProperty()
方法时,如果不指定,configurable、enumerable 和 writable 特性的默认值都是 false。谨慎使用。 - 由于浏览器版本限制,建议不要在 IE8 中使用 Object.defineProperty() 方法。
2、访问器属性
2.1、 访问器属性不包含数据值;它们包含一对儿 getter 和 setter 函数
(不过,这两个函数都不是必需的)。
getter函数:
读取访问器属性,返回有效的值;
setter函数:
写入访问器属性,决定如何处理数据。
访问器属性有如下 4 个特性:
[[Configurable]]
和[[Enumerable]]
和数据属性中的特性一样。[[Get]]
:在读取属性时调用的函数。默认值为 undefined。[[Set]]
:在写入属性时调用的函数。默认值为 undefined。
2.2 访问器属性不能直接定义,必须使用 Object.defineProperty()
来定义
var book = {
_year: 2004, //_year前面的下划线用于表示只能通过对象方法访问的属性。
edition: 1
};
Object.defineProperty(book, "year", {//访问器属性year
//只指定get 意味属性不能写 严格模式下会报错
get: function(){
return this._year;
},
//只指定set 意味属性不能读 严格模式下会报错
set: function(newValue){
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue - 2004;
}
}
});
book.year = 2005;
alert(book.edition); //2
6.1.2 定义多个属性
- 利用
Object.defineProperties()
方法。方法可以通过描述符一次定义多个属性。 - 这个方法接收两个对象参数:
第一个对象参数:准备要添加和修改其属性的对象;
第二个对象参数:第一个对象准备要添加和修改的属性构成的对象,一一对应。
var book = {};
Object.defineProperties(book, {
//两个数据属性
_year: {
value: 2004
},
edition: {
value: 1
},
//一个访问器属性
year: {
get: function(){
return this._year;
},
set: function(newValue){
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue - 2004;
}
}
}
});
6.1.3读取属性的特征
Object.getOwnPropertyDescriptor()
方法,可以取得给定属性的描述 符。- 这个方法接收两个参数:属性所在的对象、读取其描述符的属性名称。
- 返回值是一个对象:
- 如果是访问器属性,这个对象的属性有 configurable、enumerable、get 和 set;
- 如果是数据属性,这 个对象的属性有 configurable、enumerable、writable 和 value。
var book = {};
Object.defineProperties(book, {
_year: {
value: 2004
},
edition: {
value: 1
},
year: {
get: function(){
return this._year;
},
set: function(newValue){
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue - 2004;
}
}
}
});
var descriptor = Object.getOwnPropertyDescriptor(book, "_year");
alert(descriptor.value); //2004
alert(descriptor.configurable); //false 因为属性不是直接定义在对象上的。
alert(typeof descriptor.get); //"undefined" 数据属性没有get特性。
var descriptor = Object.getOwnPropertyDescriptor(book, "year");
alert(descriptor.value); //undefined 访问器属性没有value特性
alert(descriptor.enumerable); //false
alert(typeof descriptor.get); //"function"
- 在 JavaScript 中,可以针对任何对象——包括 DOM 和 BOM 对象,使用
Object.getOwnPropertyDescriptor()
方法。 - 但在6.2.3节中说, ECMAScript 5 的Object.getOwnPropertyDescriptor()方法只能用于实例属 性,要取得原型属性的描述符,必须直接在原型对象上调用Object.getOwnProperty- Descriptor()方法。()有疑问。