Object.defineProperty()
了不起的方法,魔法函数,咱们的Vue和avalon的双向绑定都是利用此方法实现的。
先看几行代码怎么用。
var obj={}
Object.defineProperty(obj,'name',{
value:'辛培铖'
})
console.log(obj)
//就是这么简单
参数列表
第一个参数 : 目标对象
第二个参数 : 需要添加或者定义的属性名称
第三个参数 : 目标属性值所拥有的特性
前面两个参数都懂,直接说第三个参数。
{
configurable: false,
enumerable: false,
writable: false,
value: null,
set: undefined,
get: undefined
}
//这是可以传入的属性,后面是该属性的默认值
configurable :
属性是否可以被配置,包括了是否可以删除属性,是否可以修改属性等等...,比如我这个值为false,我如果要修改writable的话我需要把这个属性设置为true。
enumerable :
属性是否可以被枚举,是否可以被for...in循环遍历到,是否可以使用Object.keys()
writable :
属性是否可以被重写,包括是否可以重新复制。
value :
属性的默认值
set :
属性的监视器,一旦属性被修改,这个方法会自动调用。
get :
属性的访问器,一旦属性被访问,这个方法会自动调用。
用代码实现一下吧
var obj={}
Object.defineProperty(obj,'name',{
set:function(v){
console.log('我被改变了,改变的是'+v)
},
get:function(){
console.log('我被访问了')
}
})
obj.name='辛培铖';
console.log(obj.name)
这样会触发咱们的set和get。
执行 obj.name='辛培铖' 的时候,出发了set(监视器)方法,但是由于 configurable 属性默认为false,所以赋值失败,但是不会引起报错。
执行 console.log(obj.name)的时候,触发了get(访问器)方法,因为咱们obj.name的时候没有执行任何的操作,所以被会被认为是访问。
注意 :
在 descriptor 中不能 同时设置(get 和 set) 和 wriable 或 value，否则会错，就是说想用(get 和 set)，就不能用（wriable 或 value中的任何一个。
