为什么我不能返回箭头函数？ [复制]答案

【问题标题】：Why can't I return an arrow function? [duplicate]为什么我不能返回箭头函数？ [复制]
【发布时间】：2017-08-28 20:39:27
【问题描述】：

我这里有一点高阶排序函数。

虽然这按预期工作：

var square = (a) => a * a;

var callAndLog = (func) => {
  return function () {
    var res = func.apply(undefined, arguments);
    console.log("Result is: " + res);
    return res;
  }
};

var squareAndLog = callAndLog(square);

squareAndLog(5);  // Result is 25

这里，当我返回一个嵌入的箭头函数时，它不起作用：

var square = (a) => a * a;
var callAndLog = (func) => {
  return (() => {
    var res = func.apply(undefined, arguments);
    console.log("Result is: " + res);
    return res;
  })
};
var squareAndLog = callAndLog(square);
squareAndLog(5); // Result is NaN

我知道箭头函数是松散的，这就是为什么我在这里尝试在括号() 中返回它。没有它们也行不通。

【问题讨论】：

squareAndLog(5); // Result is NaN — 我无法重现该问题。当我运行该代码时，它会引发异常：“ReferenceError：未定义参数
箭头函数do not bind arguments，所以在你的第二个例子中你没有应用你所期望的。请改用(...args) => ...。请参阅this 和this 了解更多详情。

标签： javascript ecmascript-6 higher-order-functions arrow-functions

【解决方案1】：

来自MDN：

箭头函数表达式的语法比函数表达式短，并且不绑定自己的this、arguments、super 或new.target。

箭头函数不会将arguments 对象绑定到它们的主体。您的函数依赖于arguments 的使用，因此它不能用作箭头函数。

如上面 cmets 中的建议，您可以改用 ...args：

var square = (a) => a * a;
var callAndLog = (func) => {
  return (...args) => {
    var res = func.apply(undefined, args);
    console.log("Result is: " + res);
    return res;
  };
};
var squareAndLog = callAndLog(square);
squareAndLog(5);

我知道箭头函数是松散的，这就是为什么我在这里尝试在括号 () 中返回它。

将箭头函数括在括号中对其行为没有影响。很少有（如果有的话？）情况。

【讨论】：

但它不应该给ReferenceError吗？还是它以某种方式依赖于浏览器？
@AndrewLi 如果 OP 的代码包含在包含它的其他一些非箭头函数中，那么无论何时调用该外部函数，arguments 都会引用 arguments 对象。
我明白这一点，但昆汀似乎提出了不同的建议。也许有些浏览器对待它的方式不同？
@AndrewLi 我没有看到昆汀说上面的代码在最外层范围内。他可能只是忽略了提及那个细节。

【解决方案2】：

箭头函数没有arguments 对象，您可以像这样使用rest parameter syntax (...)：

var square = (a) => a * a;
var callAndLog = (func) => {
  return ((...args) => {
    var res = func.apply(undefined, args);
    console.log("Result is: " + res);
    return res;
  })
};
var squareAndLog = callAndLog(square);
squareAndLog(5);

【讨论】：