使用ES6导入将方法添加到类原型会产生带有“this”的错误

Question

考虑以下两个文件：

// push.js
export default (item) => {
  this.items.push(item);
};

-

// index.js
import push from './push';

class pushy {
  constructor() {
    this.items = [];
  }
}

pushy.prototype.push = push;

export default pushy;

预期的效果将是导出的pushy有一个可用的push方法，该方法将推送到this.items。然而，实际的结果是一个错误。

TypeError:无法读取未定义的属性“项”

这些错误表明，this似乎是一个问题。

现在有趣的是，如果要恢复到require和module.exports，一切都像预期的那样完美地工作。

// push.js
module.exports = function(item) {
  this.items.push(item);
};

-

// index.js
function pushy() {
  this.items = [];
}

pushy.prototype.push = require('./push');

module.exports = pushy;

据我所知，这两个版本应该是相同的，但它们不是。是否有一种使用ES6的方法，或者我将不得不使用旧的语法？

Answer 1

箭头函数的全部要点是，它们绑定词法this值，永远不让它消失。因此，你不能在这种情况下使用它们。对于this值将发生变化的函数，您必须使用函数表达式(或声明)。

使用函数表达式没有任何问题。它们看上去可能不太好(在我看来)，但它们实际上只是另一种工具。