JavaScript数据描述符号和存取属性描述符

112 阅读1分钟

JavaScript数据描述符号和存取属性描述符

let obj = {
    name: "ziu",
    age: 18
}

Object.defineProperty(obj, "height", {
    value: 1.88
})

console.log(obj);

obj对象的控制台输出中, 并没有defineProperty新定义的height, 这是因为不可枚举 这个属性已经被添加到对象中, 只不过因为不可以枚举, 在打印时候, 并没有和其它属性一起输出

属性描述符是一个对象, 根据功能不同, 可以分为两类: 数据属性描述符号和存储属性描述符号

数据属性描述符号:

  • value: 该属性对应的值, 默认为undefined
  • configurable: 该属性描述符号是否被改变, 是否可以被删除, 默认为false
  • enumerable: 该属性是否可以被枚举, 默认为false
  • writeable: 该属性是否可以被写入新的值, 默认为false
let obj = {name: "xxx", age: 18};
Object.defineProperty(obj, "address", {
    value: "beijing",
    configurable: false,
    enumerable: true,
    writable: true
});

delete obj.address;
obj.address = "shanghai";
console.log(obj.address);

for (let key in obj) {
    console.log(key);
}

存储属性描述符号

  1. get当访问该属性的时候, 会调用此函数
  2. set当属性被修改的时候, 会调用此函数
let obj = {
    name: "ziu",
    age: 18,
    _address: "Beijing"
}

Object.defineProperty(obj, "address", {
    enumerable: true,
    configurable: true,

    get: function() {
        return this._address;
    },

    set: function(val) {
        this._address = val;
    }
});

console.log(obj.address); //beijing
obj.address = "shanghai"; //调用setter()
console.log(obj._address); //shanghai