Object.defineProperty() 是一个 JavaScript 内置的方法，它允许你精确地向一个对象添加或修改一个属性。
// Object.defineProperty() 是 JavaScript 中的一个方法，用于在一个对象上定义一个新的属性，或者修改一个对象的现有属性，并返回这个对象。
// Object.defineProperty(obj, propertyName, descriptor) 接受三个参数：
// obj：要定义属性的对象。
// propertyName：要定义或修改的属性的名称或Symbol。
// descriptor：一个对象，它描述了将被定义或修改的属性。
// descriptor 对象可以有两种形式：数据描述符和存取描述符。
// 数据描述符：具有值的属性，该值可以是可写的，也可以是不可写的。
// value：属性的值。默认为 undefined。
// writable：如果为 true，则属性的值可以被重新赋值。默认为 false。
// enumerable：如果为 true，则属性可以在 for...in 循环和 Object.keys() 方法中被枚举。默认为 false。
// configurable：如果为 true，则属性的类型、属性描述符以及属性值都可以被改变，并且该属性也可以从相应的对象中被删除。默认为 false。
// 存取描述符：由 getter-setter 函数对组成的属性。
// get：一个函数，当访问该属性时会被调用。默认为 undefined。
// set：一个函数，当修改该属性时会被调用。默认为 undefined。
// 需要注意的是，数据描述符和存取描述符不能同时使用在一个属性上，否则会抛出异常。
<div id="app">
18
</div>
//页面部分测试
// 模拟 Vue的data
let data = {
msg: '哈哈',
age: '18',
}
this.data = {}
getDefineProperty()
function getDefineProperty() {
Object.defineProperty(this, 'age', {
get() {
console.log('执行get')
return data.age;
},
set(newValue) {
console.log('执行set')
// 相同数据去除
if (newValue === data.age) return
data.age = newValue
document.querySelector('#app').textContent = data.age
}
})
}
console.log(this.age);
this.age=20
控制台输入测试
