javascript - 为什么在 JavaScript 中使用 getter 和 setter?

标签 javascript getter-setter

我知道 JavaScript 中的 getter 和 setter 是如何工作的。我不明白的是,当我们使用普通函数可以获得相同的结果时,为什么我们需要它们?考虑以下代码:

var person = {
    firstName: 'Jimmy',
    lastName: 'Smith',
    get fullName() {
        return this.firstName + ' ' + this.lastName;
    }
}

console.log(person.fullName);    // Jimmy Smith

我们可以轻松地用函数替换 getter:

var person = {
    firstName: 'Jimmy',
    lastName: 'Smith',
    fullName: function() {
        return this.firstName + ' ' + this.lastName;
    }
}

console.log(person.fullName());    // Jimmy Smith

我不明白写 getter 和 setter 有什么意义。

最佳答案

使用 getter 或 setter 与使用标准函数之间的区别在于,getter/setter 会在赋值时自动调用。所以它看起来就像一个普通属性,但在幕后,您可以在赋值之前或之后运行额外的逻辑(或检查)。

因此,如果您决定将这种额外逻辑添加到已被引用的现有对象属性之一,您可以将其转换为 getter/setter 样式,而无需更改有权访问该属性的其余代码。

编辑:这是一个额外逻辑的例子,这个类计算它的名字被读了多少次:

class MyClass {
  constructor() {
    this.refCount = 0;
    this._name = 'the class';
  }

  get name() {
    this.refCount++;
    console.log(`name is read ${this.refCount} times.`);
    return this._name;
  }
}

const myClass = new MyClass();

let maxMessages = 5;
const t = setInterval(() => {
  console.log(`name: ${myClass.name}`);
  
  if (--maxMessages < 1) {
    console.log('done');
    clearInterval(t);
  }
}, 1000);

关于javascript - 为什么在 JavaScript 中使用 getter 和 setter?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42342623/

相关文章:

javascript - 如果选中复选框,则显示表单的其余部分

javascript - return 语句在 setter 中做什么?

java - Android中如何全局访问SQl​​ite返回的数据?

javascript - express 应用服务器。只听所有接口(interface)而不是本地主机

javascript - CodeMirror更改模式没有样式

javascript - 圆环图中的小值不可见 - Chartjs

c# - 获取电话号码设置

java - 我们应该使用 collection、get 和 set 吗?

java - 通过 setter 方法执行过滤?

javascript - 当父 div 在 JavaScript 中改变大小时动态设置行高/保持文本垂直居中