通常是命名空间（见下文）并控制成员函数和/或变量的可见性。把它想象成一个对象定义。它的技术名称是立即调用函数表达式(IIFE)。jQuery 插件通常是这样编写的。

在 Javascript 中，您可以嵌套函数。所以，以下是合法的：

function outerFunction() {
   function innerFunction() {
      // code
   }
}

现在您可以调用outerFunction()，但是 的可见性innerFunction()仅限于 的范围outerFunction()，这意味着它是私有的outerFunction()。它基本上遵循与 Javascript 中的变量相同的原则：

var globalVariable;

function someFunction() {
   var localVariable;
}

相应地：

function globalFunction() {

   var localFunction1 = function() {
       //I'm anonymous! But localFunction1 is a reference to me!
   };

   function localFunction2() {
      //I'm named!
   }
}

在上述场景中，您可以globalFunction()从任何地方调用，但不能调用localFunction1或localFunction2。

您在编写时所做的(function() { ... })()是将第一组括号内的代码作为函数文字（意味着整个“对象”实际上是一个函数）。之后，您将自调用()刚刚定义的函数（最后一个）。因此，正如我之前提到的，这样做的主要优点是您可以拥有私有方法/函数和属性：

(function() {
   var private_var;

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

在第一个示例中，您将按globalFunction名称显式调用以运行它。也就是说，您只需globalFunction()运行它即可。但在上面的例子中，你不仅仅是在定义一个函数；您可以一次性定义和调用它。这意味着当您的 JavaScript 文件加载时，它会立即执行。当然，你可以这样做：

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

除了一个显着差异外，行为基本相同：使用 IIFE 时避免污染全局范围（因此，这也意味着您不能多次调用该函数，因为它没有名称，但是由于此函数仅意味着在它确实不是问题时才执行）。

IIFE 的巧妙之处在于，您还可以在内部定义事物，并且仅将您想要的部分暴露给外部世界（命名空间示例，因此您基本上可以创建自己的库/插件）：

var myPlugin = (function() {
 var private_var;

 function private_function() {
 }

 return {
    public_function1: function() {
    },
    public_function2: function() {
    }
 }
})()

现在可以打电话myPlugin.public_function1()，但是不能访问private_function()！非常类似于类定义。为了更好地理解这一点，我推荐以下链接以供进一步阅读：

• 命名你的 Javascript
• Javascript 中的私有成员（由 Douglas Crockford 提供）

编辑

我忘了提。在那个 final 中()，你可以传递任何你想要的东西。例如，当你创建 jQuery 插件时，你传入jQuery或$像这样：

(function(jQ) { ... code ... })(jQuery) 

所以你在这里所做的是定义一个函数，它接受一个参数（称为jQ，一个局部变量，并且只为该函数所知）。然后，您将自行调用该函数并传入一个参数（也称为jQuery，但该参数来自外部世界并且是对实际 jQuery 本身的引用）。没有迫切需要这样做，但有一些优点：

• 您可以重新定义全局参数并为其指定一个在本地范围内有意义的名称。
• 有一个轻微的性能优势，因为在本地范围内查找内容更快，而不是必须沿着范围链进入全局范围。
• 压缩（缩小）有好处。

前面我描述了这些函数如何在启动时自动运行，但如果它们自动运行，谁在传递参数？此技术假定您需要的所有参数都已定义为全局变量。因此，如果 jQuery 尚未定义为全局变量，则此示例将不起作用。正如您可能猜到的，jquery.js 在其初始化期间所做的一件事是定义一个“jQuery”全局变量，以及它更著名的“$”全局变量，它允许在包含 jQuery 后运行此代码。

简而言之

概括

以最简单的形式，此技术旨在将代码包装在函数作用域内。

它有助于减少出现以下情况的机会：

• 与其他应用程序/库冲突
• 污染上级（全球最有可能）范围

它不会检测文档何时准备就绪 - 它不是某种document.onload或window.onload

它通常被称为Immediately Invoked Function Expression (IIFE)或Self Executing Anonymous Function。

代码解释

var someFunction = function(){ console.log('wagwan!'); };

(function() {                   /* function scope starts here */
  console.log('start of IIFE');

  var myNumber = 4;             /* number variable declaration */
  var myFunction = function(){  /* function variable declaration */
    console.log('formidable!'); 
  };
  var myObject = {              /* object variable declaration */
    anotherNumber : 1001, 
    anotherFunc : function(){ console.log('formidable!'); }
  };
  console.log('end of IIFE');
})();                           /* function scope ends */

someFunction();            // reachable, hence works: see in the console
myFunction();              // unreachable, will throw an error, see in the console
myObject.anotherFunc();    // unreachable, will throw an error, see in the console

在上面的例子中，函数中定义的任何变量（即使用 声明var）将是“私有的”并且只能在函数范围内访问（正如 Vivin Paliath 所说）。换句话说，这些变量在函数外部不可见/不可访问。见现场演示。

Javascript 具有函数作用域。“在函数中定义的参数和变量在函数外是不可见的，在函数内任何地方定义的变量在函数内的任何地方都是可见的。” （来自“Javascript：好的部分”）。

更多细节

替代代码

最后，之前贴出的代码也可以这样：

var someFunction = function(){ console.log('wagwan!'); };

var myMainFunction = function() {
  console.log('start of IIFE');

  var myNumber = 4;
  var myFunction = function(){ console.log('formidable!'); };
  var myObject = { 
    anotherNumber : 1001, 
    anotherFunc : function(){ console.log('formidable!'); }
  };
  console.log('end of IIFE');
};

myMainFunction();          // I CALL "myMainFunction" FUNCTION HERE
someFunction();            // reachable, hence works: see in the console
myFunction();              // unreachable, will throw an error, see in the console
myObject.anotherFunc();    // unreachable, will throw an error, see in the console

见现场演示。

根

迭代 1

有一天，有人可能会想“一定有一种方法可以避免命名 'myMainFunction'，因为我们想要的只是立即执行它。”

如果你回到基础，你会发现：

• expression: 评估一个值的东西。IE3+11/x
• statement：线（S）的代码做的东西，但它并没有计算到的值。IEif(){}

类似地，函数表达式的计算结果为一个值。一个结果（我假设？）是它们可以立即被调用：

 var italianSayinSomething = function(){ console.log('mamamia!'); }();

所以我们更复杂的例子变成了：

var someFunction = function(){ console.log('wagwan!'); };

var myMainFunction = function() {
  console.log('start of IIFE');

  var myNumber = 4;
  var myFunction = function(){ console.log('formidable!'); };
  var myObject = { 
    anotherNumber : 1001, 
    anotherFunc : function(){ console.log('formidable!'); }
  };
  console.log('end of IIFE');
}();

someFunction();            // reachable, hence works: see in the console
myFunction();              // unreachable, will throw an error, see in the console
myObject.anotherFunc();    // unreachable, will throw an error, see in the console

见现场演示。

迭代 2

下一步是“var myMainFunction =如果我们甚至不使用它为什么要使用它！？”。

答案很简单：尝试删除它，如下所示：

 function(){ console.log('mamamia!'); }();

见现场演示。

它不起作用，因为“函数声明不可调用”。

诀窍是通过删除var myMainFunction =我们将函数表达式转换为函数声明。有关这方面的更多详细信息，请参阅“资源”中的链接。

下一个问题是“为什么我不能将其保留为带有除 之外的其他内容的函数表达式var myMainFunction =？

答案是“你可以”，实际上有很多方法可以做到这一点：添加 a +、 a !、 a -，或者用一对括号括起来（就像现在的惯例一样），我相信更多。例如：

 (function(){ console.log('mamamia!'); })(); // live demo: jsbin.com/zokuwodoco/1/edit?js,console.

或者

 +function(){ console.log('mamamia!'); }(); // live demo: jsbin.com/wuwipiyazi/1/edit?js,console

或者

 -function(){ console.log('mamamia!'); }(); // live demo: jsbin.com/wejupaheva/1/edit?js,console

• 函数前的感叹号有什么作用？
• 函数名前的 JavaScript 加号

因此，一旦将相关修改添加到我们曾经的“替代代码”中，我们将返回与“代码解释”示例中使用的完全相同的代码

var someFunction = function(){ console.log('wagwan!'); };

(function() {
  console.log('start of IIFE');

  var myNumber = 4;
  var myFunction = function(){ console.log('formidable!'); };
  var myObject = { 
    anotherNumber : 1001, 
    anotherFunc : function(){ console.log('formidable!'); }
  };
  console.log('end of IIFE');
})();

someFunction();            // reachable, hence works: see in the console
myFunction();              // unreachable, will throw an error, see in the console
myObject.anotherFunc();    // unreachable, will throw an error, see in the console

阅读更多关于Expressions vs Statements：

• developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators
• developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions#Function_constructor_vs._function_declaration_vs._function_expression
• Javascript：语句和表达式之间的区别？
• 表达式与语句

揭秘范围

人们可能想知道的一件事是“如果您没有在函数内部‘正确’定义变量——即进行简单的赋值，会发​​生什么？”

(function() {
  var myNumber = 4;             /* number variable declaration */
  var myFunction = function(){  /* function variable declaration */
    console.log('formidable!'); 
  };
  var myObject = {              /* object variable declaration */
    anotherNumber : 1001, 
    anotherFunc : function(){ console.log('formidable!'); }
  };
  myOtherFunction = function(){  /* oops, an assignment instead of a declaration */
    console.log('haha. got ya!');
  };
})();
myOtherFunction();         // reachable, hence works: see in the console
window.myOtherFunction();  // works in the browser, myOtherFunction is then in the global scope
myFunction();              // unreachable, will throw an error, see in the console

见现场演示。

基本上，如果未在其当前作用域中声明的变量被赋值，则“查找作用域链直到它找到该变量或命中全局作用域（此时它将创建它）”。

在浏览器环境中（相对于像 nodejs 这样的服务器环境），全局范围由window对象定义。因此我们可以做到window.myOtherFunction()。

我关于这个主题的“良好实践”提示是在定义任何东西时始终使用var：无论是数字、对象还是函数，甚至在全局范围内。这使得代码更简单。

笔记：

• JavaScript并没有有block scope（更新：在添加区块范围的局部变量ES6）。
• javascript 只有function scope& global scope（window在浏览器环境中的范围）

阅读更多关于Javascript Scopes：

• var 关键字的用途是什么，何时使用（或省略）？
• JavaScript 中变量的作用域是什么？

资源

• youtu.be/i_qE1iAmjFg?t=2m15s - Paul Irish 在 2:15 分展示 IIFE，一定要看！
• developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions
• 书：Javascript，好的部分- 强烈推荐
• youtu.be/i_qE1iAmjFg?t=4m36s - Paul Irish 在 4:36 展示了module模式

下一步

一旦你有了这个IIFE概念，它就会导致module pattern，这通常是通过利用这种 IIFE 模式来完成的。玩得开心 ：）

浏览器中的 Javascript 只有几个有效的作用域：函数作用域和全局作用域。

如果变量不在函数范围内，则它在全局范围内。并且全局变量通常是不好的，所以这是一种将库的变量保留给自身的构造。

这叫做闭包。它基本上密封了函数内部的代码，以便其他库不会干扰它。这类似于在编译语言中创建命名空间。

例子。假设我写：

(function() {

    var x = 2;

    // do stuff with x

})();

现在其他库无法访问x我创建的要在我的库中使用的变量。

您也可以在更大的表达式中使用函数闭包作为数据，就像在这种确定浏览器对某些 html5 对象的支持的方法中一样。

   navigator.html5={
     canvas: (function(){
      var dc= document.createElement('canvas');
      if(!dc.getContext) return 0;
      var c= dc.getContext('2d');
      return typeof c.fillText== 'function'? 2: 1;
     })(),
     localStorage: (function(){
      return !!window.localStorage;
     })(),
     webworkers: (function(){
      return !!window.Worker;
     })(),
     offline: (function(){
      return !!window.applicationCache;
     })()
    }