JS中的 Object.defineProperty

Object.defineProperty

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

语法：

Object.defineProperty(obj,prop,descriptor);

obj，要定义属性的对象；

prop，要定义或修改的属性的名称；

descriptor，要定义或修改的属性描述符，{} 形式，有6个描述符，如下：

-- value， 是当前属性的值，可为任意有效JS值；默认值：undefined; 

-- configurable，为 true 时，当前属性可被删除；默认值: false；

-- enumerable，为 true 时，当前属性可被枚举；默认值: false; 

-- writable，为 true 时，当前属性的 value 才能被修改；默认值：false；

-- get，属性的 getter 函数，不传参，会传入 this 对象，函数返回值是当前属性的值；默认值：undefined; 

-- set， 属性的 setter 函数，调用此函数修改当前属性的值，接受参数，会传入赋值时的 this 对象；

返回值：被传递给函数的对象；

和 “=” 相比较

为 javascript 对象新增或修改属性有两种方式：

1） 使用 “ = ” ；

2） 使用 Object.defineProperty();

let person = {};
person.name = 'Jack';
Object.defineProperty(person,'gender',{
    value: 'male'
});
console.log(person);  // {name: 'Jack', age: 18, gender: 'male'}

使用 "=" 赋值的 name 属性颜色深，使用 Object.defineProperty() 方法赋值的 gender 颜色浅，必有鬼；

使用 ​​Object.getOwnPropertyDescriptors()​​ 查看 person.name 和 person.gender 这两属性的属性描述符时，会发现不一样； 

Object.getOwnPerpertyDescriptors() 方法，获取一个对象的所有自身属性的描述符；

console.log(Object.getOwnPropertyDescriptors(person));

使用 “=” 赋值时：

属性的 ​​writable​​​、​​enumerable​​​、​​configurable ​​ 这三个属性描述符都是 true ，分别代表：可被修改、可被枚举和可被删除；

使用 Object.defineProperty() 方法赋值时：

属性的这三个属性描述符都是 false，也就是说当前属性不能被修改、不可被枚举(遍历)也不可被删除；但属性描述符的状态都是可以修改的；

试验一下：修改属性，确实不能修改；

试验一下：枚举属性，确实不能枚举，只显示了可被枚举的 name 属性；

试验一下：删除属性，确实不能删除；

代码改一下，两个就等价了；

let person = {};
person.name = 'Jack';
Object.defineProperty(person,'gender',{
    value: 'male',
    writable:true,
    enumerable:true,
    configurable:true
});
console.log(person);
console.log(Object.getOwnPropertyDescriptors(person));

同时，也可以被修改、被枚举和可以被删除了。