Question

我掌握了Javascript IIFE的本质，但在阅读this page时，我对这种用法感到困惑。

听起来以下JavaScript模式很常见：

(function(something) {

    something.foo = 123;

})(something || something = {})

用法示例：

(function(something) {

    something.foo = 123;

})(something || something = {})

console.log(something); // {foo:123}

(function(something) {

    something.bar = 456;

})(something || something = {})

console.log(something); // {foo:123, bar:456}

由于something在全局范围内定义，此模式与以下简单代码相关的好处是什么：

var something;
something.foo = 123;
something.bar = 456;

使用它会有意义吗？

Answer 1

你得到一个关于something的关闭，这确保即使其他一些代码覆盖了全局范围，你仍然可以正确引用something，它是jQuery.noConflict();用jQuery和<script src="/path/to/jquery.js"></script> <script> (function($) { // Here $ is jQuery // Something asynchrone is happening: setTimeout(function() { // But $ is still jQuery }, 1000); })($); </script> <script> // Someone calls jQuery.noConflict(); jQuery.noConflict(); // And now $ is not jQuery </script>更好地说明：

commit f9afb9e89918faaff09686ce1df4a36f12e82693
Author: Kshitiz Sharma
Date:   Fri May 20 11:59:00 2016 +0100

    Deleted tags

commit f3b90300799878178c09841ccac7ffcd4c9cc4d9
Author: Kshitiz.Sharma
Date:   Fri Jun 10 13:00:32 2016 +0000

    Refactor some code

    git-svn-id: svn://1.1.1.1/myrepo@29029 ca623f4c-c864-0410-95d3-a40aa24e21c6

commit c98ad952b84403908ba656ab2f18af9a18a4f95c
Author: Kshitiz.Sharma
Date:   Wed Jun 8 14:35:29 2016 +0000

    Handle nullpointer exception

    git-svn-id: svn://1.1.1.1/myrepo@29010 ca623f4c-c864-0410-95d3-a40aa24e21c6

Answer 2

假设您的应用程序具有命名空间myApp。您有几个添加功能的脚本，因为像一个优秀的开发人员一样，您已将应用程序分解为不同的块。也像一个好的 web 开发人员，你正在异步加载这些脚本，你不知道它们将被添加到什么顺序。所以你有每个模块有条件地创建应用程序的名称空间（如果它不存在）（(myApp || {})部分）。您还希望隐藏模块的内部功能，使其不需要了解它，因此您将“命名空间”对象传递给创建闭包的函数，并将模块的API附加到命名空间对象{{1 }}

myApp

这种模式并非没有缺陷（如果// async loaded script for the foo 'module' (function(myApp) { var myPrivate = 3; // hidden in the closure myApp.getFoo = function() { return myPrivate; }; }(myApp || {});取决于myApp.foo会怎样？）这就是为什么它主要被browserify / require.js / webpack / etc取代。

这种基于IIFE的JavaScript模式有什么好处？

2 个答案: