理解对象的属性类型
对象:ECMA-262将对象定义为一组属性的无序集合。
属性的类型
ECMAScript有两种属性:
1.数据属性
2.访问器属性
1.数据属性包含一个数据值的位置。在这个位置可以读取和写入值,言下之意即:数据属性是可以直接通过对象.属性的形式访问和赋值的。
数据属性有4个描述属性行为的特性,用于描述属性的各种特征。
这些特性是为了javascript实现引擎的规范而定义的,为了表示这四个特性是内部特性,该规范把他们放在了两对儿方括号中,开发者不能在javascript中直接访问这些特性。
- [[Configurable]]:
- 能否通过delete删除属性从而重新定义属性;
- 能否修改属性的特性;
- 能否把属性修改为访问器属性
- [Enumerable]]:表示能否通过for-in循环返回属性
- [Writable]]:表示能否修改属性值
- [Value]]:包含这个属性的数据值
字面量方式创建对象时数据属性的特性默认值如下:
var person = {
name : "Nicholas"// name是数据属性
}
[[Configurable]]:true,
[Enumerable]]:true,
[[Writable]]:true,
[[Value]]:Nicholas,这个特性的默认值是undefied
将属性显示添加到对象后,[[Configurable]]、[Enumerable]]、[[Writable]]都会被设置为true,而[[Value]]特性会被设置为指定值。
let person = new Object();
person.name = "Nicholas";
要是需要修改属性的默认特性,必须使用ES5的Object.defineProperty()
方法,这个方法接收三个参数,属性所在的对象,属性的名字和一个描述符对象。其中描述符对象的属性必须是:configurable,writeable,enumerable,value。设置其中一个或多个值,可以修改对应的特性值。
var person ={};
Object.defineProperty(person,'name',{
writable:false,
value:'Nicholas'
})
alert (person.name);// "Nicholas"
person.name = "Greg"
alert (person.name);// "Nicholas"
上述代码中,如果writable=false,则意味着这个属性的值是不可修改的,如果尝试为它指定新值,非严格模式下重新赋值会被忽略,严格模式下,尝试修改只读属性的值会抛出错误。
类似规则也适用于创建不可配置属性
var person ={};
Object.defineProperty(person,'name',{
configurable:false,
value:'Nicholas'
})
alert (person.name);// "Nicholas"
person.name = "Greg"
alert (person.name);// "Nicholas"
上述代码中,在非严格模式下对这个属性调用delete没有效果,严格模式下会报错。另外需要注意的是,一个属性在定义为不可配置后,就不能再变回可配置了,再次调用Object.defineProperty
并修改任何非writable属性会导致错误。
下面代码,验证了如果再调用Object.defineProperty()方法把writable从false改为true会报错
上述代码,验证了true改为false是允许的。
上述代码,表示了在调用Object.defineProperty()方法时,如果不指定,configurable,enumberable和writable特性的默认值都是false.所以属性值没有更改成功。
多数情况下,可能都没有必要利用该方法提供的高级功能,不过,理解这些概念对理解javascript对象非常有用。
不建议在IE8中使用Object.defineProperty()方法,因为只能在DOM对象上使用这个方法,而且只能创建访问器属性。
2.访问器属性
访问器属性不包含数据值,它们包含一对getter和setter函数(这两个函数都不是必需的)。在读取访问器属性时,会调用getter函数,这个函数负责返回有效的值;在写入访问器属性时,会调用setter函数并传入新值,这个函数负责决定如何处理数据。
访问器属性有如下4个特性
- [[Configurable]]:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性或者能否把属性修改为数据属性。对于直接在对象上定义的属性,这个特性的默认值为true。
- [[Enumberable]]:表示能否通过for-in循环返回属性。对于直接在对象上定义的属性,这个特性的默认值是true。
- [[Get]]:在读取属性时调用的函数,默认值是undefined。
- [[Set]]:在写入属性时调用的函数,默认值是undefined。
访问器属性不能直接定义,必须使用Object.defineProperty()来定义:
var book ={
_year:2004,
edition:1
};
Object.defineProperty(book,"year",{
get: function() {
return this._year;
}
set: function(newValue) {
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue - 2004;
}
}
});
book.year = 2005;
alert(book.edition);// 2
以上代码创建了一个对象,并给它定义了两个默认属性:_year与edition。_year前面的下划线是一种常用记号,用于表示只能通过对象方法访问的属性(私有属性)。
对于使用Object.defineProperty()定义的访问器属性year,包含getter和setter函数。getter返回_year的值,setter函数通过计算来确定edition的值。因此,把year属性修改为2005,会导致_year变成2005,而edition变为2。这是使用访问器属性的常见方式,即设置一个属性的值会导致其他属性放生变化。
不一定非要同时指定getter和setter,只指定getter意味着属性是不能写的,尝试写入属性会被忽略,在严格模式下,尝试写入会抛出错误;只指定setter函数的属性也是不能读的,在非严格模式下返回undefined,而在严格模式下会抛出错误。
对于Object.defineProperty()这个方法,支持的浏览器IE9+、Firefox4+、Safari5+、Opera12+、Chrome。在不支持Object.defineProperty()方法的浏览器中不能修改[[Configurable]]、[[Enumberable]].
- 点赞
- 收藏
- 关注作者
评论(0)