Can't get setters/getters to work

Can't get setters/getters to work

本文关键字：getters to work setters get Can      更新时间：2023-09-26

我想将Mike Herchel的Importing CSS Breakpoints转换为ES6类。为此，我选择使用get和set来最终学习如何。

到目前为止我的代码：

export default class Breakpoints {
  constructor() {
    this.value = null;
    this.refreshValue();
    window.addEventListener('resize', () => {
      this.refreshValue();
    });
  }
  refreshValue() {
    let val = window.getComputedStyle(document.querySelector('body'), ':before').getPropertyValue('content').replace(/'"/g, '');
    this.value = val;
  }
  set value(val) {
    this.value = val;
  }
  get value() {
    return this.value;
  }
}

问题是，当我运行它时，我得到了Maximum call stack size exceeded。我哪里做错了？

这里绝对没有理由使用getters/ssetter，它们除了普通属性之外不会做任何其他事情。

当我运行它时，我得到了Maximum call stack size exceeded。我哪里做错了？

getter再次返回属性的值，从而调用它自己。您的setter再次设置属性的值，从而调用它自己。不要那样做。

如果出于某种原因你真的想使用getter，那就选择

export default class Breakpoints {
  constructor() {
    this._val = null;
    this.refreshValue();
    window.addEventListener('resize', () => {
      this.refreshValue();
    });
  }
  refreshValue() {
    this._val = window.getComputedStyle(document.querySelector('body'), ':before').getPropertyValue('content').replace(/'"/g, '');
  }
  get value() {
    return this._val;
  }
  // no `value` setter, because it can't be changed from outside
}
相关文章：