浅谈Object.defineProperty

参数

• obj：必需。目标对象
• prop：必需。需定义或修改的属性的名字
• descriptor：必需。目标属性所拥有的特性

descriptor中的参数

• Configurable:表示能否通过delete删除属性从而重新定义属性；
• Enumerable：表示能否通过for-in循环返回属性
• writable：表示能否修改属性的值
• Value：包含这个属性的数据值
• get：读取属性值执行的内置函数
• set：更改属性值执行的内置函数更改后的参数会在形参中

Configurable

 var obj = {a:1}
        Object.defineProperty(obj,"a",{
            configurable:true
        })
        delete obj.a
        console.log(obj)//{}

 var obj = {a:1}
        Object.defineProperty(obj,"a",{
            configurable:false
        })  
         delete obj.a
        console.log(obj)//{a:1}

var obj = {}
//第一种情况：configurable设置为false，不能再次修改特性。
Object.defineProperty(obj,"a",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:false
});

//重新修改特性
Object.defineProperty(obj,"a",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.a ); //报错：Uncaught TypeError: Cannot redefine property: a

//第二种情况：configurable设置为true，可以再次修改特性。
Object.defineProperty(obj,"a",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:true
});

//重新修改特性
Object.defineProperty(obj,"a",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.a ); //hello

Enumerable

var obj = {a:1,b:2}
        Object.defineProperty(obj,"a",{
            enumerable:true
        })
        for (const key in obj) {
            if (obj.hasOwnProperty(key)) {
                const element = obj[key];
                console.log(key) // a b
            }
        }

var obj = {a:1,b:2}
        Object.defineProperty(obj,"a",{
            enumerable:false
        })
        for (const key in obj) {
            if (obj.hasOwnProperty(key)) {
                const element = obj[key];
                console.log(key) // b
            }
        }

writable

var obj = {a:1}
        Object.defineProperty(obj,"a",{
            writable:false
        })
      obj.a=3
      console.log(obj)//{a:1}

存取器描述

当使用存取器描述属性的特性的时候，允许设置以下特性属性：

var obj = {};
Object.defineProperty(obj,"a",{
    get:function (){} | undefined,
    set:function (value){} | undefined
    configurable: true | false
    enumerable: true | false
});

注意：当使用了getter或setter方法，不允许使用writable和value这两个属性

var obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"a",{
    get:function (){
        //当获取值的时候触发的函数
        return initValue;    
    },
    set:function (value){
        //当设置值的时候触发的函数,设置的新值通过参数value拿到
        initValue = value;
    }
});
//获取值
console.log( obj.a );  //hello

//设置值
obj.a = 'change value';

console.log( obj.a ); //change value

注意：get或set不是必须成对出现，任写其一就可以。如果不设置方法，则get和set的默认值为undefined

参考：segmentfault.com/a/119000000…