以下代码:

(function () {

})();

称为立即调用函数表达式(IIFE)。

它之所以被称为函数表达式，是因为Javascript中的(yourcode)操作符将其强制转换为表达式。函数表达式和函数声明的区别如下:

// declaration:
function declaredFunction () {}

// expressions:

// storing function into variable
const expressedFunction = function () {}

// Using () operator, which transforms the function into an expression
(function () {})

表达式只是一组可以求值为单个值的代码。对于上面例子中的表达式，这个值是一个单独的函数对象。

在得到表达式后，计算结果为函数对象，然后可以立即使用()操作符调用函数对象。例如:

(函数(){ Const foo = 10;//这里的所有变量都是函数块的作用域 console.log (foo); }) (); console.log (foo);// referenceError foo的作用域是IIFE

为什么这个有用?

当我们处理大型代码库和/或导入各种库时，命名冲突的几率会增加。当我们在IIFE中编写相关(因此使用相同的变量)的代码的某些部分时，所有的变量和函数名都被限定在IIFE的函数括号内。这减少了命名冲突的可能性，让你在命名时更粗心(例如，你不必在它们前面加上前缀)。

自执行匿名函数。它在创建时立即执行。

举个简单的例子，说明这个方法很有用:

function prepareList(el){
  var list = (function(){
    var l = []; 
    for(var i = 0; i < 9; i++){
     l.push(i);
    }
    return l;
  })();

  return function (el){
    for(var i = 0, l = list.length; i < l; i++){
      if(list[i] == el) return list[i];
    }
    return null;
  }; 
} 

var search = prepareList();
search(2);
search(3);

因此，不是每次都创建一个列表，而是只创建一次(开销更少)。

它是一个立即调用的函数表达式，简称IIFE。它在创建后立即执行。

它与任何事件的任何事件处理程序(例如document.onload)无关。 考虑第一对括号中的部分:(function(){})();....它是一个正则函数表达式。然后看最后一对(function(){})();，它通常被添加到表达式中来调用函数;在这种情况下，我们之前的表达式。

当试图避免污染全局名称空间时，通常使用此模式，因为在IIFE中使用的所有变量(像在任何其他正常函数中一样)在其作用域之外是不可见的。 这可能就是为什么您将此结构与window的事件处理程序混淆的原因。Onload，因为它经常被这样使用:

(function(){
  // all your code here
  var foo = function() {};
  window.onload = foo;
  // ...
})();
// foo is unreachable here (it’s undefined)

Guffa建议的更正:

函数在创建后立即执行，而不是在解析后执行。整个脚本块在执行其中的任何代码之前都会被解析。此外，解析代码并不自动意味着它被执行，例如，如果IIFE在函数内部，那么直到函数被调用，它才会被执行。

更新 因为这是一个非常流行的话题，值得一提的是，IIFE也可以用ES6的箭头函数来编写(就像Gajus在评论中指出的那样):

((foo) => {
 // do something with foo here foo
})('foo value')

该构造称为立即调用函数表达式(IIFE)，这意味着它将立即执行。可以把它看作是解释器到达该函数时自动调用的函数。

最常见的用例:

它最常见的用例之一是限制通过var创建的变量的作用域。通过var创建的变量的作用域仅限于一个函数，因此这个构造(这是一个围绕某些代码的函数包装器)将确保你的变量作用域不会泄漏到该函数中。

在下面的例子中，count在立即调用的函数之外是不可用的，即count的作用域不会泄漏到函数之外。您应该得到一个ReferenceError，如果您尝试在立即调用的函数之外访问它。

(function () { 
    var count = 10;
})();
console.log(count);  // Reference Error: count is not defined

ES6备选方案(推荐)

在ES6中，我们现在可以通过let和const创建变量。它们都是块范围的(不像var是函数范围的)。

因此，对于上面提到的用例，您不必使用IIFE的复杂构造，现在可以编写更简单的代码，以确保变量的作用域不会泄漏到所需的块中。

{ 
    let count = 10;
}
console.log(count);  // ReferenceError: count is not defined

在本例中，我们使用let定义count变量，使count限制在我们用花括号{…}创建的代码块中。

我称之为“卷毛监狱”。

这是Javascript中立即调用的函数表达式:

为了理解JS中的IIFE，让我们分解一下:

表达式:返回值的东西 示例:在chrome控制台中尝试以下操作。这些是JS中的表达式。

A = 10 输出= 10 (1 + 3) 输出= 4

函数表达式: 例子:

函数表达式 var greet = function（name）{ 返回“Namaste” + ' ' + 名称; } 问候（“桑托什”）;

函数表达式如何工作: - JS引擎第一次运行时(执行上下文-创建阶段)，这个函数(上面=右侧)不会被执行或存储在内存中。变量'greet'被JS引擎赋值为'undefined'。 -在执行期间(执行上下文-执行阶段)，函数对象是动态创建的(尚未执行)，被分配给'greet'变量，可以使用'greet(' someename ')'调用。

3.立即调用的函数表达式:

例子:

// IIFE
var greeting = function(name) {
    return 'Namaste' + ' ' + name;
}('Santosh')

console.log(greeting)  // Namaste Santosh. 

IIFE如何运作: -注意函数声明后面的'()'。每个函数对象都有一个可调用的'CODE'属性。我们可以使用大括号'()'调用它。 -所以这里，在执行期间(执行上下文-执行阶段)，函数对象被创建并同时执行 -所以现在，greeting变量没有函数对象，而是有它的返回值(一个字符串)

JS中IIFE的典型用例:

下面的IIFE模式是非常常用的。

// IIFE 
// Spelling of Function was not correct , result into error
(function (name) {
   var greeting = 'Namaste';
   console.log(greeting + ' ' + name);
})('Santosh');

我们在这里做两件事。 a)将函数表达式包装在大括号()中。这将告诉语法解析器放在()中的whatever是一个表达式(在本例中是函数表达式)，并且是一个有效的代码。 b)我们同时调用这个函数，在它的末尾使用()。

因此，这个函数同时被创建和执行(IIFE)。

IIFE的重要用例:

IIFE使我们的代码安全。 -作为一个函数，IIFE有自己的执行上下文，这意味着在它内部创建的所有变量都是这个函数的局部变量，不与全局执行上下文共享。

假设我的应用程序中使用了另一个JS文件(test1.js)和life . JS(见下文)。

// test1.js

var greeting = 'Hello';

// iife.js
// Spelling of Function was not correct , result into error
(function (name) { 
   var greeting = 'Namaste';
   console.log(greeting + ' ' + name);
})('Santosh');

console.log(greeting)   // No collision happens here. It prints 'Hello'.

所以IIFE帮助我们编写安全的代码，这样我们就不会无意中与全局对象发生冲突。

使用自调用匿名函数的原因是它们永远不应该被其他代码调用，因为它们“设置”了要调用的代码(同时为函数和变量提供了作用域)。

换句话说，它们就像在程序开始时“创建类”的程序。在它们被实例化(自动)之后，唯一可用的函数是匿名函数返回的那些函数。然而，所有其他“隐藏”函数仍然存在，以及任何状态(在作用域创建期间设置的变量)。

非常酷。