一、在新对象初始化时定义 getter setter
var obj = {
log: ["a", "b", "c"],
get latest() {
if (this.log.length == 0) {
return undefined;
}
return this.log[this.log.length - 1];
},
set latest(name) {
this.log.push(name);
}
};
latest 被称作伪属性。
getter 跟 Vue 里的计算属性 computed 非常类似。
可以用delete操作符删除 getter setter。
delete obj.latest;
二、使用Object.defineProperty在现有对象上定义getter setter
getter setter在 Object.defineProperty 里属于存取操作符。
重新定义原有的属性：
var obj = { a: 0 };
Object.defineProperty(obj, "a", {
get: function() {
return 1;
},
set: function(x) {
console.log("set a");
}
});
给新添加的属性定义getter setter：
var obj = { a: 0 };
Object.defineProperty(obj, "b", {
get: function() {
console.log('this', this)
return this.a + 1;
},
set: function(x) {
this.a = x / 2;
}
});
三、Object.defineProperty 语法
语法：
Object.defineProperty(obj, prop, descriptor)
默认情况下，使用 Object.defineProperty() 添加的属性值是不可修改的。
对象里的属性描述符（descriptor）有两种主要形式：数据描述符和存取描述符。
数据描述符和存取描述符均具有以下可选键值(默认值是在使用Object.defineProperty()定义属性的情况下)：
- configurable：当且仅当该属性的 configurable 为 true 时，该属性
描述符才能够被改变，同时该属性也能从对应的对象上被删除。默认为 false。 - enumerable：当且仅当该属性的
enumerable为true时，该属性才能够出现在对象的枚举属性中（比如Object.keys()， for...in）。默认为 false。
数据描述符：
- value
- writable：当且仅当该属性的
writable为true时，value才能被赋值运算符改变。默认为 false。
存取描述符：
- getter函数（上面已经提及）
- setter函数
注意：描述符必须是这两种形式之一；不能同时是两者。
Object.defineProperty 返回一个对象。
let a = Object.defineProperty({}, "name", {
enumerable: true,
value: "jim"
});
console.log(a); //{name: 'jim'}
四、Object.getOwnPropertyDescriptor()
用于获取属性自身的特性。
// 通过 Object.defineProperty 为 ob 添加一个属性c
Object.defineProperty(ob, "c", {
value: 3,
enumerable: false,
writable: false,
configurable: false
});
Object.getOwnPropertyDescriptor(ob, "c");
// => {value:3, enumeralbe: false, writable: false, configurable: false}
参考文章