0

我正在尝试使用下面的代码对 Array 对象进行子类化。如果您在浏览器中运行代码，它可以正常工作。但是，如果我将此代码放在一个 .js 文件中，并在该文件中包含一个<script>标记，则该.add()方法是未定义的。

class Collection extends Array {
  constructor(data) {
    super(...data);
  }

  add(model) {
    this.push(model);
  }

}

const coll = new Collection(['item1', 'item2']);

console.log(coll);      // -> ['item1', 'item2']
console.log(coll.add);  // -> undefined

当我加载页面时，.add()未定义。但是当我将完全相同的代码复制粘贴到控制台时，它就可以工作了。

这是怎么回事？

更新 我也在使用 Babel.js (v6.x) 进行编译，结果证明这是问题所在，正如 Fuechter 在他的回答中解释的那样。

4

1 回答 1

1

使固定：

class Collection extends Array {
  constructor(data) {
    super(...data);
    this.add = function(model) {
      this.push(model);
    }
  }
}

为什么：

Babel 不支持扩展原生类。它在 5.2.17 版本中被删除（参见这个提交）

它已被删除，因为它无法正常工作，请参阅错误：https ://phabricator.babeljs.io/T1424

不太可能添加它，因为它不是可以模拟的功能。我们将不得不等待浏览器中的本机支持（有些已经在实验模式下支持它）。这也意味着它当前在不同浏览器中的行为会有所不同。

参考：链接

于 2016-09-07T18:10:24.077 回答