V8 中的 ES6 箭头函数词法 this

Question

我有以下使用胖箭头函数的 ES6 代码：

var test = {
  firstname: 'David',
  fn: function() {
    return ['one', 'two', 'tree'].map(() => this.firstname)
  }
}
console.log(test.fn())

根据箭头函数的工作方式，我希望 this 是 test 对象。 ES6Fiddle、Traceur 和 Firefox 产生预期的输出，即 ["David", "David", "David"]。

但是，当使用 chrome://flags/#enable-javascript-harmony 在 Chrome 中启用这些功能时，我得到了 [undefined, undefined, undefined]。如果你console.log(this) 它表明它是窗口对象并且你在严格模式下得到一个错误。 ES6 箭头函数的词法 this 还没有在 V8 中实现吗？

Answer 1

词法this 是 ES6 箭头函数在 v8 中的最后一部分，这也是它仍然落后于标志并且尚未准备好发布的原因。 Igalia 的 Adrian Perez 正在实现箭头功能，一旦解决了一些 TurboFan 问题，最终补丁几乎已经准备就绪：https://codereview.chromium.org/883823002/

Answer 2

粗箭头是 ES6 的一个特性。它已在 Firefox(Gecko) 中引入，但尚未在其他浏览器中引入（尤其是在 V8 中还没有完全引入，这对于 nodejs/iojs 开发来说很有趣）。这是一个参考文档

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions#Browser_compatibility

无论如何，如果您需要范围绑定，那么请使用 bind() 而不是 =>。这是一个简单的例子。

而不是这个。

$("#example").on("click", () => {
   // your code goes here
});

使用这个。

$("#example").on("click", (function() {
   // your code goes here
}).bind(this));

如果您不需要范围绑定，那么只需这样做。

$("#example").on("click", function() {
   console.log("example");
});