javascript - IIFE void function() vs (function()) 在括号中使用 void 与包装的区别

标签 javascript iife

创建模块的常见做法是将它们包裹在括号中,这样您就不会在模块外泄漏任何变量(在连接等时)。

还有 void 运算符,它计算给定的表达式并返回 undefined。 (参见MDN)

我想知道更喜欢在括号中包装函数而不是使用 void 的原因是什么。它是历史的,它是否与串联有关,否则?

我知道当其中一个文件缺少分号时,您可能会遇到连接问题,这会导致严重的问题,直到您注意到为止。

例子

例如,module1.js(注意缺少的逗号):

(function () {
    return function () {
        console.log('module1. I should not be called');
    };
})()

和 module2.js:

(function () {
    return function () {
        console.log('module2. I should not be called either');
    };
})();

如果您将这些脚本合并成一个包,它会产生这样的结果:

(function () {
    return function () {
        console.log('module1. I should not be called');
    };
})()(function () {
    return function () {
        console.log('module2. I should not be called either');
    };
})();

由于两个模块(文件)都返回一个函数,第二个假定的 IIFE 变成了对第一个模块的返回值的调用,有效地调用了 console.log。常见的解决方法是使用 !(function (){})(); 声明您的模块,这会强制返回值为 bool 值。

但是,如果您要使用 void,例如:

void function () {
    return function () {
        console.log('module1. I should not be called');
    };
}()

连接后的文件仍然会出错,但您会在第一次运行时注意到错误,因此更容易注意到。见下文。

void function () {
    return function () {
        console.log('module1. I should not be called');
    };
}()void function () {
    return function () {
        console.log('module2. I should not be called either');
    };
});

这会抛出 Unexpected token void。就模块而言,我相信 !(function(){}()void function(){}() 达到相同的效果。但我觉得像 void 看起来比用参数包装函数并在其前面加上 ! 看起来更干净(主观)。

我错过了什么?如果我们使用 void 不是更好吗?

最佳答案

嗯,许多 JavaScript 程序员认为 void 令人困惑和多余,尤其是 Douglas Crockford,他称它为 "Bad Parts" 之一的JavaScript。

在函数定义之前加上 void 可能会特别困惑。在 C++ 等语言中,它的意思是“这是一种不返回值的函数”。在 JavaScript 中,void 不定义任何东西;相反,它计算函数(或其他表达式)并返回值 undefined。所以你在 JavaScript 代码中看不到它。

有关在模块之前使用 ! 的更多信息,请查看 this StackOverflow answer .

另请务必阅读 Ben Allman's original blog post on IIFE's .

关于javascript - IIFE void function() vs (function()) 在括号中使用 void 与包装的区别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28828348/

相关文章:

javascript - Q Promise同步应答

JavaScript 的 URL 绝对路径在一个页面上有效,但在另一个页面上创建 ajax 错误消息

javascript - 让 Angular-socket-io 与 Grunt 一起工作

javascript - 如何使用 SwiftSoup 抓取重定向的特定网站?

javascript - FullPage.js:仅在滚动时显示导航

javascript - 传递给 IIFE 的对象属性(数字)的类型返回未定义。为什么?

javascript - 将参数传递给 Go IIFE(以下 javascript 示例)

javascript - JavaScript 中的 (function() { } )() 结构是什么?

javascript - 创建一个 JS 类 : IIFE vs return prototype

使用 angular.js 的 For 循环中的 Javascript 闭包(涉及 2 个闭包 - 一个 $http.get 调用和一个 $scope.$watch)