javascript - 透明ES6箭头函数或命名函数 - 什么更好？

Question

ECMAScript 6标准为JavaScript语言添加了许多新功能，包括新的arrow function表示法。

目前我将代码转换为es6。现在有时有两种选择。我想知道哪一个更好。

如果可能，请使用命名函数：

document.getElementById('rotate').addEventListener('change', function rotate() {
  rotate(parseInt(this.value, 10));
});

如果可能，请使用箭头功能：

document.getElementById('rotate').addEventListener('input', (event) => {
  rotate(parseInt(event.target.value, 10));
});

我现在知道了这个

命名函数

• 可以在错误堆栈中看到函数名称。

箭头功能

• 语法简单。

还有其他优点或缺点

Answer 1

词法this可在箭头功能内访问，无法访问arguments且无法绑定。

常规函数可以访问动态this，arguments并且可以绑定。

决定哪一个必须用作回调是基于此。如果不涉及this，则可以使用箭头函数作为经验法则。

大多数接受回调的API（例如本机addEventListener和jQuery）也将其上下文作为回调参数提供，因此不需要动态this，它们可以与箭头一起使用。 / p>

某些API（例如D3）不考虑此问题，需要访问动态this;它们应仅用于常规函数，并需要self = this技巧才能访问词法this。像this one这样的解决方案可用于提供带有预期动态this作为参数的箭头。