深入Object.defineProperty

从名字就可以看出，Object.defineProperty()其实就是用于定义一个对象的属性的，有三个点

1. 给哪个对象添加或修改属性
2. 添加或者修改的属性名
3. 属性名对应的value值等相关配置

三个点也是对应3个必填参数

let obj = {}
Object.defineProperty(obj, 'name', {
    value: 'alice'
});
console.log(obj.name)//alice

上述代码中，表示往obj对象中添加一个属性name，值为alice
Object.defineProperty()三个传参都必填，如果参数漏填或者格式不正确，例如我第三个参数没写，就会直接报错Uncaught TypeError: Property description must be an object: undefined
但平时我们往往使用.操作符来给一个对象添加属性或者修改已有属性的属性值

let obj = {}
obj.name = 'alice'
console.log(obj.name)//alice

上述代码跟前面的代码实现的功能是一致的，都是给obj对象添加一个属性name，值为alice
到这里你可能会由一个疑问，居然平时使用.的形式可以代替Object.defineProperty()的功能，那是不是没有必要使用Object.defineProperty()？
我们要知道，每个语法都有自己的使用场景的！其实如果仅仅是给对象的一个属性对应的value值，确实没有必要用到Object.defineProperty()，直接使用对象.属性 = xxx的形式就好了。但是如果要给属性配置一些特性，那就得用它了，因为Object.defineProperty()的第三个参数就是属性对应的一些配置，也被称为属性的描述descriptor，其中包含例子中写的属性值value

---

值得注意的是：默认情况下，使用 Object.defineProperty()添加的属性值是不可修改（immutable）的
如果再通过Object.defineProperty()重新修改Object.defineProperty()定义过的属性，会被提示不能重复定义:Uncaught TypeError: Cannot redefine property: xxx
如果通过对象.属性 = xxx的形式尝试修改用 Object.defineProperty()新增的属性，虽然没有语法错误，但是当再次访问时，结果还是Object.defineProperty()之前定义的值

let obj = {}
Object.defineProperty(obj, 'name', {
    value: 'alice'
});
obj.name ='tom'
console.log(obj.name)//alice

上述代码中，通过obj.name='tom'再次修改对应的值，访问时还是Object.defineProperty()之前定义的值alice;
上面这两种情况都是展示了那句话：默认情况下，使用 Object.defineProperty()添加的属性值是不可修改（immutable）的
但还有一种情况得区分开，就是先定义了属性的，在通过Object.defineProperty()来修改，如果没有修改相关配置，是可以通过 对象.属性=xxx的形式或者通过Object.defineProperty()再次修改的

let obj = {}
obj.name ='lbj'
console.log(obj.name)//lbj
Object.defineProperty(obj, 'name', {
    value: 'alice'
});
console.log(obj.name)//alice
obj.name ='tom'
console.log(obj.name)//tom
Object.defineProperty(obj, 'name', {
    value: 'aaa'
});
console.log(obj.name)//aaa

以上代码中，由于最开始就存在这个属性，所以可以通过obj.name=xxx或者用Object.defineProperty()重复修改

---

下面回过头来看，属性描述中还可以配置哪一些？

对象里目前存在的属性描述符有两种主要形式：数据描述符和存取描述符。数据描述符是一个具有值的属性，该值可以是可写的，也可以是不可写的。存取描述符是由 getter函数和 setter 函数所描述的属性。一个描述符只能是这两者其中之一；不能同时是两者。

这两种描述符都是对象。它们共享以下可选键值

1. configurable
   表示可配置的，默认值为false；当值为true时，该属性的描述符才能够被改变，同时该属性也能从对应的对象中删除
2. enumerable
   表示可枚举的，默认为false；当设置为true时，该属性才会在对象枚举时枚举到

数据描述符还具有可选键值:

1. value
   表示属性对应的值，默认undefined
2. writable
   表示可写的，当writable为true时，属性值才能被赋值运算符更改成功；默认值为false，所以默认情况下，使用Object.defineProperty()添加的属性值是不可修改（immutable）的

存取描述符还具有以下可选键值：

1. get
   当获取该属性时，会执行get函数，get返回值就是属性值

let obj = {}
Object.defineProperty(obj, 'name', {
    configurable: true,
    enumerable: true,
    get: function () {
        console.log(`你访问了obj.name属性哦`);
        return 'tom';
    }
})
console.log(obj.name)

上述代码中，当访问obj.name时，会执行get方法，打印出你访问了obj.name属性哦,同时返回值tom就是该属性的值
如果get没有返回值，默认属性值为undefined
get执行时不用传入任何参数，需要注意的是：里头的this指向一般是该对象，但不一定是！

2. set
   当修改对象的属性值时会调用set函数

let obj = {}
Object.defineProperty(obj, 'name', {
    configurable: true,
    enumerable: true,
    set: function (val) {
        console.log(`设置obj.name的值为：${val}`)
    }
})
obj.name = 'aaa'//

上面代码中，设置obj.name的值为aaa，默认会将设置的值aaa作为set函数的第一个参数传递进去

小结一下：

1. 数据描述符可以拥有：
   configurable、enumerable、value、writable
   存取描述符可以拥有：
   configurable、enumerable、get、set

2. configurable、enumerable 和 writable 的默认值都是 false；
   value、get 和 set的默认值为undefined

3. 如果一个描述符不具有value、writable、get 和 set 中的任意一个键，那么它将被认为是一个数据描述符。如果一个描述符同时拥有 value 或writable 和get 或 set键，则会报错

4. Object.defineProperty()的返回值就是属性要添加在的对象，其实就是第一个参数