先看看 JavaScript 对象的两类属性 数据属性: value:就是属性的值。 writable:决定属性能否被赋值,默认 true。 enumerable:决定 for in 能否枚举该属性,默认 true。 configurable:决定该属性能否被删除或者改变特征值,默认 true。 访问器(getter/setter)属性: getter:函数或 undefined,在取属性值时被调用。 setter:函数或 undefined,在设置属性值时被调用。 enumerable:决定 for in 能否枚举该属性。 configurable:决定该属性能否被删除或者改变特征值。 通过 `Object.getOwnPropertyDescriptor `可以拿到对象的这几个属性的值 ```js var obj = { a: 1 }; Object.getOwnPropertyDescriptor(obj, 'a'); ``` 要修改属性,可以使用`Object.defineProperty`函数修改 ```js var obj1 = { a: 1 }; Object.defineProperty(obj1, 'a', { value: 2 }); console.log(obj1) // {a: 2} Object.defineProperty(obj1, 'a', { get() { return 3} }); console.log(obj1) // { a: 3, get a: f get() } ``` 2020.03.03更新 最近在是使用Vue 3 开发,在Vue 3 里面已经抛弃了Object.defineProperty 而采用 Proxy Proxy 的语法也很简单 ```js let proxy = new Proxy(target, handler); ``` target: 需要代理的目标对象 handler: 自定义的行为 例子: ```js let obj = { a: 1 } let proxy = new Proxy(obj, { get: function(target, prop) { return target[prop]; }, set: function(target, prop, value) { console.log('set value') target[prop] = value; } }) console.log(proxy.a) // 1 proxy.a = 2 console.log(proxy.a) // set value, 2 ``` 使用 Proxy 改写上面的 Object.defineProperty() 的实现 ```html Document

``` 参考资料 1. [JavaScript对象:面向对象还是基于对象?](https://time.geekbang.org/column/article/79319) 2. [初探 Vue3.0 中的一大亮点——Proxy !](