定义对象
两种形式定义对象
let person = new Object()obj.name = '蛙人'obj.age = 23obj.sex = 'male'obj.getAge = function() { return this.age}
下面的例子创立了一个person对象实例,并为它增加了属性及办法,在晚期js开发人员常常应用这种形式,然而当初对象字面量成了首先形式,看一下字面量定义对象。
let person = { name: '蛙人', age: 23, sex: 'male', getAge() { return this.age }}
能够看到下面这种应用字面量的形式定义对象更加简洁明了,字面量的形式跟第一种定义形式是一样的。
属性类型
在说数据属性时,咱们先来讲一下js里的外部属性, 在Es5版本中,在定义只有外部才用的个性attribute
时,形容了属性property
的各种
特色, 定义这些个性是为了实现js引擎用的,因而在js里无法访问外部属性,外部属性是两个中括号括起来的例如 [[Enumerable]]
。
数据属性
数据属性蕴含一个数据值的地位,在这个地位能够进行读取和写入值,那么这就是数据属性形容对象。
[[Configuralbe]]
: 示意是否能够delete删除该属性,是否能在对象上定义其它属性,是否能批改属性值,默认返回true。[[Enumerable]]
:示意是否能够枚举该属性for in
, 默认返回true。[[Writeable]]
: 示意是否能够读写改属性,默认返回true。[[Value]]
: 示意属性值的地位,每次读取属性的时,从这个[[Value]]
外部属性返回值,写入属性值的时候,把值保留在这个地位,默认返回undefined,这也就是咱们所读取对象上不存在的属性时,返回undefined的起因。
实践讲完了,那么间接上代码一把梭
[[Value]]
let person = { name: '蛙人'}
下面example中定义属性name,为它的值默认 “蛙人” 也就是说,在外部属性 [[Value]] 中保留了该值, 从这点咱们明确,只有是对象中批改或写入值,都会触发外部属性 [[Value]]。
批改属性形容对象
如果要批改数据属性的形容对象,应用Es5中Object.defineProperty()
办法,这个办法接管三个参数,指标对象、要拜访的属性、属性的形容对象,形容对象必须是: configurable、enumerable,writeable、value
, 设置其中一或多属性,能够批改对应的形容属性值。
let person = {}Object.defineProperty(person, 'name', { writeable: false, // 不能写入 value: '你没有permission'})console.log(person.name) // 你没有permissionperson.name = "蛙人"console.log(person.name) // 你没有permission
在下面example中,咱们设置了person对象形容对象为只读不可写,又为它设置了value属性,所以不论它怎么读取都返回你没有permission
,怎么写都不能够,须要留神的是下面代码在严格模式下会抛出谬误,在非严格模式下赋值操作则会疏忽
, 而且更为重要的一点,Object.defineProperty第三个参数必须写,不然code报错
拜访器属性
数据拜访器属性不蕴含数据值, 他们蕴含一对 getter和setter函数 (这两个函数不是必须的 可选)。
在读取拜访器属性时,会调用getter函数,在写入拜访器属性时,会调用setter函数,函数接管一个参数这个参数就是写入的值。
[[get]]
:在读取属性时调用的函数,默认返回undefined[[set]]
:在写入属性时调用的函数,默认返回undefined
拜访器属性不能间接定义,应用Object.defineProperty(),请看上面 example
let person = { _age: 23, name: '蛙人'}Object.defineProperty(person, "age", { get() { return this._age }, set(val) { this._age = val }})person.age = 24
下面example中,写入age属性就会触发拜访器对象里的set函数,从而从新赋值,而后触发get办法,返回该属性值,下面应用了_age这种定义形式示意为罕用的mark,示意只能通过对象办法拜访的属性, 不要间接写在get函数返回里返回本身 如:this.age = xxx 这样会造成堆栈溢出
定义多个形容属性
Es5版本中还有一个Api办法是定义多个对象写入形容属性, 该办法接管2个参数,指标对象、属性值,请看下列example
let person = {}Object.defineProperties(person, { _age: { value: 23 }, name: { value: "蛙人" }, age:{ get() { return this._age }, set(val) { this._age = val; } }})
下面example与 上一个example都是同样的代码成果,只不过定义形式不同,该办法不常常应用,大家晓得就好。
获取对象的形容属性
Es5版本中定义了一个Api办法能够查看以后对象的形容属性,Object.getOwnPropertyDescriptor(), 该办法接管2个参数,指标对象、属性值
。
let person = { age: 23}let descriptor = Object.getOwnPropertyDescriptor(person, "age")console.log(descriptor.writable) // trueconsole.log(descriptor) // {"value":23,"writable":true,"enumerable":true,"configurable":true}
下面example中能够分明的看见以后的对象属性的形容对象,这样在呈现bug的时候,咱们也能够查看以后的形容属性是否能够更改,疾速定位bug,在js中能够针对任何对象应用Object.getOwnPropertyDescriptor(), 包含BOM和DOM对象
,兼容IE9 +、Firefox4+、Safari5+、Opera12+、Chrome。
如果该文章对你有帮忙,请点个赞吧