是否有技术或代码风格的原因不命名您的 IIFE 函数？答案

【问题标题】：Are there technical or code style reasons not to name your IIFE functions?是否有技术或代码风格的原因不命名您的 IIFE 函数？
【发布时间】：2018-06-25 16:43:39
【问题描述】：

立即调用函数表达式 (defined and explained here) 通常写成...

(function() { /* code */ })();

Ben Alman 在上面的文章中添加了以下评论：

向函数表达式添加标识符（从而创建命名函数表达式）在调试时非常有用。

命名您的 IIFE 有一个调试优势，例如...

(function myComponentIIFE(){ /* code */ })();

如果有一些优势，那么命名所有其他匿名的 IIFE 似乎应该是一种常见的做法。 IIFE 通常是匿名的有什么原因吗？匿名函数是否以不同的方式处理以使其具有某些优势？

【问题讨论】：

您打算重用该功能吗？为什么要给一个你不会再次使用并且不希望其他人能够使用的函数留下一个悬空名称？
好处在于代码可读性和可读堆栈跟踪。与(function(){ (function(){ shouldThrowError(); })(); })();相比，在控制台中尝试(function outerComponentIIFE(){ (function innerComponentIIFE(){ shouldThrowError(); })(); })();
除非您不必支持旧的 IE
@Teemu 想详细说明“匿名函数表达式和命名函数表达式之间没有区别”并提供答案参考？
唯一的区别是命名函数在引用自身的函数内部创建一个绑定。在功能方面没有任何区别。

标签： javascript ecmascript-6 iife

【解决方案1】：

(function() { /* code */ })() 比 (function myComponentIIFE(){ /* code */ })() 短，在压缩代码中占用的字节少 2 个字节，思考和输入的时间也更少。

函数名称在调试时非常有用，仅当它在未缩小的应用程序中使用无法链接到相应行的文本日志进行调试时。在任何其他情况下，它都是无用的。

在缩小的应用程序中，它不利于调试并变成这样：

(function a(){ /* code */ })();

在浏览器控制台输出堆栈跟踪条目可以通过点击动态导航到实际代码。

IIFE 在现代 JavaScript 中的使用有限。 IIFE 在 ES5 中被大量用于实现模块模式和/或为代码块提供范围。这些用途目前由 ES6 块作用域和模块处理。

应用程序中存在的大多数 IIFE 将由工具自动生成。其中只有少数是由开发人员编写的。如果已知 IIFE 有利于调试或产生自记录代码，那么是的，给函数命名是有意义的。

现代 JS 中的一个例子是 async IIFE，它有它的用途，例如，作为应用程序入口点：

(async function main() {
  // ...
})()
.catch(console.error);

【讨论】：