前言
我们在Object [下]中有提到 getter / setter
,由于这个部分在书中的解释是比较旧的版本,所以找过新版的资料后整理在此篇章中。
getter是一种获取特定属性的方法,setter是设置特定属性的方法,getter和setter常被用在:
对物件初始化可以随时添加属性到任何物件中Getter(the get Keyword)
有时候物件属性会需要回传动态的数据
,或要在不使用明确的方法呼叫(不直接访问物件属性)下反映出内部变数
的状态,这样可以使用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
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); // cdelete obj.latest;console.log(obj.latest); // undefined
新增get到现有物件中
我们除了在一开始建立物件的时候定义getter之外,可以使用defineProperty
添加getter给现有物件中
。
const obj = { a: 0}Object.defineProperty(obj, 'b', { get: function(){ return this.a + 1; }})console.log(obj.b); // 1
Setter
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
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
新增set到现有物件中
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