什么是立即执行函数？

简单来说：立即执行函数就是声明一个匿名函数，然后马上执行这个匿名函数.

并不等于这样：

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

在一个表达式后面加上括号()，该表达式会立即执行，但是在一个语句后面加上括号()，是完全不一样的意思，他的只是分组操作符。

// 下面这个function在语法上是没问题的，但是依然只是一个语句
// 加上括号()以后依然会报错，因为分组操作符需要包含表达式
 
function foo(){ /* code */ }(); // SyntaxError: Unexpected token )
 
// 但是如果你在括弧()里传入一个表达式，将不会有异常抛出
// 但是foo函数依然不会执行
function foo(){ /* code */ }( 1 );
 
// 因为它完全等价于下面这个代码，一个function声明后面，又声明了一个毫无关系的表达式： 
function foo(){ /* code */ }
 
( 1 );

匿名函数常见的形式

// 下面2个括弧()都会立即执行

(function () { /* code */ } ()); // 推荐使用这个
(function () { /* code */ })(); // 但是这个也是可以用的

// 由于括弧()和JS的&&，异或，逗号等操作符是在函数表达式和函数声明上消除歧义的
// 所以一旦解析器知道其中一个已经是表达式了，其它的也都默认为表达式了
// 不过，请注意下一章节的内容解释

var i = function () { return 10; } ();
true && function () { /* code */ } ();
0, function () { /* code */ } ();

// 如果你不在意返回值，或者不怕难以阅读
// 你甚至可以在function前面加一元操作符号

!function () { /* code */ } ();
~function () { /* code */ } ();
-function () { /* code */ } ();
+function () { /* code */ } ();

// 还有一个情况，使用new关键字,也可以用，但我不确定它的效率
// http://twitter.com/kuvos/status/18209252090847232

new function () { /* code */ }
new function () { /* code */ } () // 如果需要传递参数，只需要加上括弧()

2、那么立即执行函数有什么作用呢？

创建一个独立的作用域，这个作用域里面的变量，外面访问不到，

eg

var List = document.getElementsByTagName('li');

for (var i = 0; i < List.length; i++) {

    List[i].onclick=function(){
          alert(i);
    };

}

//alert出来的总是6，而不是0、1、2、3、4、5，这是因为i的作用域是全局而不是给每个li分配一个i





// 解决的办法就是利用立即执行函数给每个li创立一个独立的作用域，在立即执行函数执行的时候把i的值赋值给a，a的值一直不变。i的值从0变化到5，对应6个立即执行函数
var List = document.getElementsByTagName('li');

for (var i = 0; i < List.length; i++) {

       ！function（a）{
            List[a].onclick=function(){
              alert(a);   //alert0、1、2、3、4、5
     }
    
  }(i);
   
}
            

 

转载于:https://www.cnblogs.com/feilu2016/p/7002323.html