Javascript Object.defineProperty 属性标签

阅读 (229)
Javascript Object.defineProperty 属性标签

Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。IE8不兼容。

Object.defineProperty(obj, 'name', {
  // configurable: false, //默认为false
  // enumerable: false, //默认为false
  value: '1',
  // writable: false, /默认为false
  // get(){},
  // set(v){}
});

 

configurable: true

writable: true

configurable: true

writable: false

configurable: false

writable: true

configurable: false

writable: false

修改属性值

✔* 注1

重设value标签修改

通过属性赋值

修改属性的值

delete该属性返回true

修改getter/setter方法 ㄨ* 注3

修改属性标签* 注2

(除了writable
从true修改为false总是允许修改)

*注1:configurable: true,writable: false 时虽然不可以直接通过属性赋值,但依然可以通过

let obj={a:1,b:2};
Object.defineProperty(obj,'b',{
    configurable: true,
    writable: false
})
obj.b=3;
console.log(obj); // {a: 1, b: 2}
Object.defineProperty(obj,'b',{
    value: 3
});
console.log(obj); // {a: 1, b: 3}

*注2:configurable: false 时,writable原来为false时,是不可修改的,但是writable原来是ture时,却总能被修改为false,不管configurable是ture还是false

let obj={a:1,b:2};
Object.defineProperty(obj,'b',{
    configurable:false,
    writable: false
});
Object.defineProperty(obj,'b',{
    writable: true
});
Object.getOwnPropertyDescriptor(obj, 'b'); // 报错:Uncaught TypeError: Cannot redefine property: b
let obj={a:1,b:2};
Object.defineProperty(obj,'b',{
    configurable:false,
    writable: true
});
Object.defineProperty(obj,'b',{
    writable: false
});
Object.getOwnPropertyDescriptor(obj, 'b'); // {value: 2, writable: false, enumerable: true, configurable: false}

*注3:当使用了get()方法或者set()方法的时候就不能使用value和writable中的任何一个属性否则会报错,反之一样,有value和writable属性时,不能使用get()方法 或者 set()方法

let obj = {};
Object.defineProperty(obj,'b',{
    configurable: true,
    writable: true,
    set: function() {
         console.log('set')
    }
});
// 报错:Uncaught TypeError: Invalid property descriptor. Cannot both specify accessors and a value or writable attribute

只用get和set

let obj = {};
var a = 1;
Object.defineProperty(obj,'b',{
    configurable: true,
    get: function() {
        console.log(a);
    },
    set: function(v) {
         a = v * 2;
    }
});
obj.b; // 会打印get方法中的console.log(a)打印 1
obj.b=1; // 会执行set方法
console.log(a); // 2

 

更新于:2021-01-08 11:06:12
返回顶部