Question

我想将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。我哪里出错了？

Answer 1

这里绝对没有理由使用getter / setter，除了普通的属性之外别无其他。

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

你的getter再次返回属性的值，从而调用自己。你的定居者再次设置属性的值，从而调用自己。不要那样做。

如果您出于某种原因真的想使用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
}

无法让setter / getters工作

1 个答案: