【Object.defineProperty】JS对属性操作的控制

如果要对一个属性进行比较精确的控制，使用属性描述符，可以精准的添加或修改对象的属性

Object.defineProperty()

参数

一共三个参数：

• 第一个参数：要对哪个对象做操作
• 第二个参数：要对哪个属性操作
• 第三个参数：属性描述符，是一个对象

属性描述符的类型

分为数据属性和存取属性

数据描述符

var obj = {
   name:"abc",
   age:18
}
//数据属性描述符
Object.defineProperty(obj, "address", {
   //配置
   value:"北京",
   configurable: false, //意味着属性不可配置(不可删除、不可修改、不可以重新定义属性描述符)
   enumerator: false, //是否可以枚举
   writable: false //属性是否可以赋值
})
//不在严格模式下就算对address进行了操作也不会报错（静默错误），但是什么也不会被改变

如果没有配置（没有设置configurable等），默认都是false，value为undefined。obj中的name和age虽然没有使用属性描述符来定义，但是也是具有对应的特性的，configurable为true，enumerable为true，writable也为true。

存取描述符

var obj = {
    name:"abc",
    age:18,
    _address:"北京市"
}
//存取属性描述符
//目的：为了隐藏某一个私有属性，不希望被外界使用和赋值；如果我们希望截获某一个属性它访问和设置值的过程时（例：foo()），也会使用存储属性描述符
Object.defineProperty(obj, "address",{
    enumerable: true,
    configurable: true,
    get: function(){
        foo();
        return this._address;
    },
    set: function(value){
        bar()
        this._address = value;
    }
    //注意get、set不能和value、writable共存
})
console.log(obj.address);

obj.address = "上海市";
console.log(obj.address);

function foo(){
    console.log("获取了一次address的值");
}

function bar(){
    console.log("设置了一次address值");
}

输出为：

Object.defineProperties()

Object.defineProperties() 方法直接在一个对象上定义多个新的属性或修改现有属性，并且返回该对象。

两个参数 一个是要对哪个对象做操作，一个是属性描述符

var obj = {
    _age: 18,
    // set age(value){
    //     this._age = value;
    // },
    // get age(){
    //     return this._age;
    // }
}
Object.defineProperties(obj,{
    name: {
        enumerable: true,
        writable: true,
        configurable:true,
        value: "abc"
    },
    age: {
        configurable: true,
        enumerable: true,
        get: function(){
            return this._age;
        },
        set: function(value){
            this._age = value;
        }
    }
})

console.log(obj);