箭头功能难以追踪吗？

Question

我刚学会了这样写：

const setName = name => {
  // set name here
}

与此相反，

很糟糕

function setName(name) {
  //set name here
}

原因是第一种方法难以调试与该功能相关的问题，因为它不会出现在堆栈跟踪中。

问题：为什么这不会出现在堆栈跟踪中？

Answer 1

  

箭头功能无法追踪吗？

不，如果您指的是能够调试它们，堆栈跟踪等，它们就像其他任何函数一样可追踪。

  

我刚刚了解到，写这篇文章是不好的，而不是......

不，不是。这不一样。这不是客观的坏.¹

  

原因是第一种方法难以调试与该功能相关的问题，因为它不会出现在堆栈跟踪中。

是的，它会。如果有人告诉你它不会，那就错了：

const setName = name => {
  throw new Error("Ack!");
};

const wrapper = name => setName(name);

wrapper("foo");

Look in the real console.

如果你运行它，你会在控制台中看到这个：

请注意setName和wrapper的列出方式。

无论谁告诉你，这可能是因为你的箭头功能没有名字。他们是mistaken about that, too。

¹事实上，另一种方式有一些参数：箭头函数没有prototype属性和与之关联的对象，调用它不需要设置新的{{1绑定或this伪对象和绑定（因为箭头没有自己的arguments，this或[相关] arguments）。所以从理论上讲，它的重量更轻。反驳这是一个可读性问题 - “我没有意识到这是一个功能” - 尽管我怀疑人们会习惯箭头功能。

Answer 2

无论是谁告诉您的，都可能是您的箭头函数没有名称的印象。他们也误会了。

似乎并非总是如此。只有将“匿名”函数分配给变量后，它们才会被命名。

const f = () => () => { debugger; };
const h = f();
const g = () => { debugger; };


console.log(f.name) // "f"
console.log(h.name) // ""
console.log(g.name) // "g"


h();
g();

调用h（）具有以下堆栈跟踪：

调用g（）具有此堆栈跟踪：

请注意，“ g”是如何命名的，“ h”只是说“匿名”。

因此，如果您在上面的示例中以编写f的方式定义部分应用的函数，则可能会遇到某些人在谈论的问题。

我想如果您依赖其他人向您报告错误并向您发送其堆栈跟踪信息，这将是一个大问题，因为如果您在开发过程中遇到了麻烦，您将可以单击并查看它

在某些示例中，您也许可以使用行号将您带到那里，但是如果有人按照捆绑的代码为您提供堆栈跟踪信息，那可能会更成问题。

您可以通过将其他函数命名为“内部”来避免这种情况...

const f1 = () => {
  const named = () => { debugger; };
  return named;
}

// or

const f2 = () => { 
  return function named() { debugger; }
};