我们在Object [下]中有提到 getter / setter
,由於这个部分在书中的解释是比较旧的版本,所以找过新版的资料後整理在此篇章中。
getter是一种获取特定属性的方法,setter是设置特定属性的方法,getter和setter常被用在:
有时候物件属性会需要回传动态的数据
,或要在不使用明确的方法呼叫(不直接访问物件属性)下反映出内部变数
的状态,这样可以使用getter来达到这个目的,
const obj = {
log: ['a', 'b', 'c'],
count: 0,
get latest() {
if (this.log.length === 0) {
return undefined;
}
obj.count ++; // 将count绑定给get
return this.log[this.log.length - obj.count]; // 将log绑定给get
}
};
for(let i = 0; i< 4; i++){
console.log(obj.latest); // 呼叫get method以访问这些被绑定给getter的属性
}
/*
c
b
a
undefined
*/
getter可以使用Delete
操作符移除。
const obj = {
log: ['a', 'b', 'c'],
count: 0,
get latest() {
if (this.log.length === 0) {
return undefined;
}
obj.count ++; // 将count绑定给get
return this.log[this.log.length - obj.count]; // 将log绑定给get
}
};
console.log(obj.latest); // c
delete obj.latest;
console.log(obj.latest); // undefined
我们除了在一开始建立物件的时候定义getter之外,可以使用defineProperty
添加getter给现有物件中
。
const obj = {
a: 0
}
Object.defineProperty(obj, 'b', {
get: function(){
return this.a + 1;
}
})
console.log(obj.b); // 1
setter能在尝试修改指定属性时执行给定的函式
,Setter最常与Getter一同建立虚拟属性(pseudo-property)。
const language = {
set current(name) {
this.log.push(name);
},
log: []
};
language.current = 'EN';
language.current = 'FA';
console.log(language.log); // ['EN', 'FA']
setter可以使用Delete
操作符移除。
const language = {
set current(name) {
this.log.push(name);
},
log: []
};
language.current = 'EN';
console.log(language.log); // 'EN'
delete language.current;
console.log(language.current); // undefined
setter一样也可以通过defineProperty
添加setter给现有物件中
。
const obj = {
a: 0
};
Object.defineProperty(obj, 'b', { set: function(x) { this.a = x / 2; } });
o.b = 10;
console.log(o.a) // 5
可以使用 getter / setter 对物件中的属性进行一些操作,特别是如果想在返回属性或设置它们之前对值做一些特殊的事情,两个方法都可以使用defineProperty
方法添加 getter/setter 到现有的物件中,也可以使用delete
将他们移除。
参考文献:
Getter 和 Setter 的定义
getter
setter
如果一件事情够重要,那麽即便所有条件都与你作对,你仍应该要做。 If something is im...
前情提要: 讲述完工具人的起源 方函式:终於到了最後一个能力async模式。 我:到现在都遇不到JS...
延续昨天的实作,今天继续研究一下大学学生人数的近况。 之前,我们曾经使用 csv 档实...
题库一个人不容易维护 如果想要多人共用试算表 就会怕有些人动到你设定好的格式 此时可以选择保护工作表...
「不是那个MAC。 不对,也不是汉堡。」 MAC能吃吗? 先前我们介绍了数位签章,今天我们要介绍的是...