Question

Object.defineproperty() 设置未按预期工作，抛出最大调用堆栈错误

2019-06-27

457

javascript object

我有一个如下所示的对象，当在此对象上定义属性 root 时，我希望修改该属性，因此我有以下代码：

html = {};

然后我像这样使用 Object.defineproperty() ：

Object.defineProperty( html , 'root' , {
    set ( val ) {
      html.root = `${val} i got the power`
    }
});

现在，当我尝试以下操作时：

html.root = 'James !!';

我收到一条错误消息：

Uncaught RangeError: Maximum call stack size exceeded

为什么我无法在修改后添加此属性 root 。

Answer 1

您使用 set 方法创建了无限循环，因为您尝试在方法内部设置具有相同名称的属性，因此会调用相同的 set 方法。

您可以使用 get 方法解决此问题，并且在 set 方法内部使用其他键名（例如原始键 + 一些前缀 _ ）。

const html = {};

Object.defineProperty(html, 'root', {
  set(val) {
    html._root = `${val} i got the power`
  },
  get() {
    return html._root
  }
});

html.root = 'James !!';
console.log(html.root)

Answer 2

html.root = 将调用 setter 本身，后者将调用 setter 本身，后者...

您不能让 setter 和其支持字段使用相同的名称，请使用不同的字段（例如 html._root ）来存储基础值。