Object.defineProperty()方法直接在一个对象上定义一个新属性，或者修改一个已经存在的属性，并返回这个对象
- value：设置属性的值
- writable：值是否可以重写。 true|false
- enumerable: 目标属性是否考可以被枚举。 true | false
- configurable: 目标属性是否可以被删除或是可以在此修改特性 true|false
- set：目标属性设置值的方法
- get：目标属性获取值的方法
// 假设我们有个对象user；我们要给她增加一个属性name，我们会这么做
var user = {};
user.name = '青阳子';
console.log(user); // {name:"青阳子"}
// 想要增加一个sayHi方法呢
user.sayHi = function () {
console.log('hi')
}
console.log(user) // {name:'青阳子',sayHi:fn}
Object.defineProperty()就是做这个的
Object.defineProperty()需要三个参数（object,propName,descriptor）
1.Object 对象 =>给谁加
2.propName 属性名 => 要加的属性的名字 (类型：string)
3.descriptor 属性描述 => 加的这个属性有什么样的特性 （类型：Object）**
那么descriptor这个是个对象，他有那些属性呢? 别着急我们一个一个说：
既然可以给一个对象增加属性，那么我们可以用它来做一下给user添加name属性，代码是这样的
var user = {};
Object.defineProperty(user, 'name', {
value: '青阳子'
})
console.log(user)
// 还是那个经典的value属性，他就是设置属性值的
// 等等，属性值只能为字符串吗? 我们的number function Object boolean等呢
var user = {};
Object.defineProperty(user, 'name', {
value: '青阳子'
})
Object.defineProperty(user, 'isSlow', {
value: true
})
Object.defineProperty(user, 'sayHi', {
value: function () { console.log(sayHi) }
})
Object.defineProperty(user, 'age', {
value: 17
})
Object.defineProperty(user, 'birth', {
value: {
data: '2021-09-29',
hour: '15:30'
}
})
console.log(user)
事实证明任何类型的数据都是可以的哦~
问题又来了，如果user对象已经有了name属性，我们可以通过Object.defineProperty改变这个值么
我们来试试
user.name = 'new青阳子'
console.log(user) // 没作用
为什么我改了没作用呢?
原因：上边说了descriptor有很多属性，除了value属性还有个writable（顾名思义就是是否可以被重新赋值）
接受数据类型为boolean（默认为false） true=>支持被重新赋值 false=>只读
哦哦，原来如果我没设置writable值的时候就默认只读啊，所以才改不掉
那我们看看，设置为true，是不是就可以改掉了
var user = {};
Object.defineProperty(user, 'name', {
value: '青阳子',
writable: true
})
console.log(user) //{name: '青阳子'}
user.name = "new青阳子"
console.log(user) //{name: 'new青阳子'}
这个descriptor还有其他的属性吗?enumerable（顾名思义属性是否可以被枚举） 接受数据类型为boolean（默认为false）
true=>支持被枚举 false=>不支持被枚举
假设我们想知道这个user对象有哪些属性,我们一般会这么做
var user = {
name: "青阳子",
age: 12
};
//es6
var keys = Object.keys(user)
console.log(keys); //['name','age']
//es5
var keys = []
for (var key in user) {
keys.push(key);
}
console.log(keys); // ['name','age']
如果我们使用 Object.defineRroperty的方式定义属性会发生什么呢？我们来看下输出
var user = {
name: "青阳子",
age: 35
};
//定义一个性别 可以被枚举
Object.defineProperty(user, "gender", {
value: "男",
enumerable: true
})
//定义一个出生日期 不可以被枚举
Object.defineProperty(user, "birth", {
value: "1986-05-03",
enumerable: false
})
//es6
var keys = Object.keys(user)
console.log(keys); // ["name", "age", "gender"]
console.log(user); // {name: "青阳子", age: 35, gender: "男", birth: "1986-05-03"}
console.log(user.birth); // 1986-05-03
说明 很明显，我们定义为 enumerable=false的birth属性并没有被遍历出来，遍历 => 其实就是枚举（个人理解啦，不喜勿喷哦~）
总结 enumerable 属性取值为 布尔类型 true | false 默认值为 false，为true时属性可以被枚举；为false则不能。此设置不影响属性的调用和 查看对象的值。
configurable 是接下来我们要讲的一个属性，这个属性有两个作用：
1.属性是否可以被删除
2.属性的特性在第一次设置之后可否被重新定义特性
var user = {
name: "青阳子",
age: 35
};
//定义一个性别，不可以被删除和重新定义特性
Object.defineProperty(user, 'gender', {
value: 'man',
enumerable: true,
configurable: false
})
// 删除一下
delete user.gender;
console.log(user); // {name: '青阳子', age: 35, gender: 'man'} 删除不掉gender属性
//重新定义特性
Object.defineProperty(user, "gender", {
value: "man",
enumerable: true,
configurable: true
})
// Uncaught TypeError: Cannot redefine property: gender
// 会报错
// 设置为true
var user = {
name: "青阳子",
age: 35
};
//定义一个性别 可以被删除和重新定义特性
Object.defineProperty(user, 'gender', {
value: '男',
enumerable: true,
configurable: true
})
// 删除前
console.log(user) // {name: "青阳子", age: 35, gender: "男"}
//删除一下
delete user.gender;
console.log(user); // {name: '青阳子', age: 35}
//重新定义特性
Object.defineProperty(user, "gender", {
value: "男",
enumerable: true,
configurable: false
})
// 删除前
console.log(user); // {name: "青阳子", age: 35, gender: "男"}
// 删除一下 删除失败
delete user.gender;
console.log(user); // {name: "青阳子", age: 35, gender: "男"}
总结 configurable设置为 true 则该属性可以被删除和重新定义特性；反之属性是不可以被删除和重 新定义特性的，
默认值为false（Ps.除了可以给新定义的属性设置特性，也可以给已有的属性设置特性哈）
最后我们来说说，最重要的两个属性get和set（即存取器描述：定义属性如何被存取），这两个属性是做什么用的呢?
我们通过代码来看看
var user = {
name: '青阳子'
};
var count = 12;
//定义一个age，获取值时返回定义好的变量count
Object.defineProperty(user, "age", {
get: function () {
return count
}
})
console.log(user.age) // 12
// 如果我每次获取的时候返回count+1呢
var user = {
name: "青阳子"
};
var count = 12;
// 定义一个age 获取值时返回定义好的变量count
Object.defineProperty(user, "age", {
get: function () {
return count + 1;
}
})
console.log(user.age); // 13
下面我不用解释了吧，你想在获取该属性的时候对值做出什么随你咯~
// 我们看看set，不多说上代码
var user = {
name: "青阳子"
};
var count = 12;
// 定义一个age，获取值时返回定义好的变量count
Object.defineProperty(user, 'age', {
get: function () {
return count;
},
set: function (newVal) {
count = newVal
}
})
console.log(user.age) // 12
user.age = 145
console.log(user.age) // 145
console.log(count) //145
//等等，如果我想设置的时候是 自动加1呢? 我设置145 实际上设置的是146
var user = {
name: "青阳子"
};
var count = 12;
// 定义一个age，获取值的时候返回定义好的变量count
Object.defineProperty(user, 'age', {
get: function () {
return count
},
set: function (newVal) {
return count = newVal + 1
}
})
console.log(user.age) // 12
user.age = 145;
console.log(user.age)// 146
console.log(count) // 146
说明 注意：当使用了getter或者setter方法，不允许使用writable和value这两个属性，（如果使用，会直接报错）
get 是获取值的时候的方法，类型为function，获取值的时候会被调用，不设置时为undefined
set 是设置值的时候的方法，类型为function，设置值的时候会被调用，不设置时为undefined
get或set不是必须成对出现，任写其一就可以
var user = {
name: "青阳子"
};
var count = 12;
// 定义一个age 获取值时返回定义好的变量count
Object.defineProperty(user, "age", {
get: function () {
console.log("这个人来获取值了！！")
return count;
},
set: function (newVal) {
console.log("这个人来设置值了！！")
count = newVal + 1
}
})
console.log(user.age) //12
user.age = 145;
console.log(user.age) // 146
备注：此文章摘自别处，非本人创作，由于找不到第一手大佬的相关信息，因此就暂不标明摘自何处