浅谈Object.defineProperty（）

为JavaScript对象新增或者修改属性，有两种不同方式：

直接使用=赋值或者使用Object.defineProperty 定义。

经常使用的定义与赋值方法obj.prop =value或者obj['prop']=value

let person ={};
person.name = 'Anny';
person['age'] = 24;
console.log(person.name)//Anny
console.log(person['age'])//24

 一般通过为对象的属性赋值的情况下，对象的属性可以修改也可以删除，但是通过Object.defineProperty()定义属性，可以设置属性的描述符,还可以通过描述符的设置可以进行更精准的控制对象属性。

Object.defineProperty()的作用

Object.defineProperty()的作用就是直接在一个对象上定义一个新属性，或者修改一个已经存在的属性。

此方法允许对对象的属性进行精确添加或修改。通过赋值添加的正常属性会创建在属性枚举（for...in循环或 Object.keys方法）期间显示的属性，其值可能会更改，并且可能会被删除。此方法允许从默认值更改这些额外的详细信息。默认情况下，使用的值Object.defineProperty()是不可变的。

语法：

Object.defineProperty(obj, prop, desc)

参数说明： 

1. obj 需要定义属性的当前对象
2. prop 当前需要定义的属性名
3. desc 属性描述符

属性所在的对象、 属性的名字、 一个描述符对象 (其中描述符对象的属性必须是: configurable、enumerable、writeable、和value)设置其中一个或多个值，可以修改对应的特性值 。

 

 给对象的属性添加特性描述，目前提供两种形式：数据描述和访问者描述符。

数据和访问者描述符都是对象。它们共享以下可选键：

1、Configurable 表示能否通过delete删除属性从而重新定义属性，能够通过属性的特性，或者能否把属性修改为访问器属性，默认值为true。

2、Enumerable表示能否通过for-in循环返回属性。默认值为true。

3、Writable表示能够修改属性的值。默认值为true 。

4、Value 包含这个属性的数据值。读取属性值的时候，从这个位置读；写入属性值的时候，把新值保存在这个位置。默认值为undefined。

writable

var person = {
    name: 'zhang',
    age: 12
};
Object.defineProperty(person,"name",{
    writable: false
});
// 读取person.name
console.log(person.name);  // zhang
console.log(person.age); //12
// 修改person.name
person.name = 'wang';
person.age = 14;
console.log(person.name);   // zhang  
console.log(person.age);  // 14
/*Writable默认是true，但是改为false之后 就是这个属性不可写，尝试写入不可写属性不会更改它，但也不会引发错误。*/

 enumerable

var person = {
    name: '一',
    age: '1',
    nickName: '小一'
};
 
for(var key in person){
    console.log(key);  //   name 、age、nickName
}

Object.defineProperty(person,'age',{
    enumerable: false
});
 
for(var key1 in person){
    console.log(key1);   // name nickName
}
// enumerable: false
console.log(person.age);  // 1  不会影响输出

表示能否通过for-in循环返回属性。默认值为true，当改为false时，是不可枚举的

Configurable 

var person = {
    name: 'zhang',
    age: 12
};
 
Object.defineProperty(person,'name',{
    configurable: false
});
 
console.log(person.name);   // zhang
console.log(person.age);    // 12
 
delete person.name;
console.log(person.name);  // zhang
// configurable: false不允许删除

person.name =  'wang'
console.log(person.name); // wang

Value

var person = {
    name: '小明'
};
console.log(person.name);  // 小明
Object.defineProperty(person,'name',{
    value: '小李'
});
console.log(person.name); //小李
了
person.name = '小明';  // 修改
console.log(person.name);  //小明

访问器描述符还具有以下可选键：

get

访问该属性时，不带参数调用此函数， 在读取属性的时候调用。返回值将用作属性的值。默认undefined。

set

赋值属性时，将使用一个参数（将值分配给属性）调用此函数，在写入属性的时候调用 。默认undefined。

get  和  set

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

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

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

冻结特性

Object.isFrozen 方法

Object.freeze 方法

浅冻结 与 深冻结https://segmentfault.com/a/1190000003894119

推荐https://blog.csdn.net/dkr380205984/article/details/79310453