Object.defineproperty

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中的任何一个。

你可能感兴趣的:(Object.defineproperty)