概要：立即执行函数的作用是建立一个作用域，防止变量污染。
立即执行函数的写法：
1 //第一种写法 2 (function(i) { 3 ... 4 } (i) ) 5 6 //第二种写法 7 (function(i) { 8 ... 9 }) (i)
例子：
废话少说，先看一个例子：
HTML代码：
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>123</title> 6 <style> 7 li{ 8 list-style: none; 9 } 10 button{ 11 width:20px; 12 height: 10px; 13 14 } 15 </style> 16 </head> 17 <body> 18 <ul> 19 <li><button></button></li> 20 <li><button></button></li> 21 <li><button></button></li> 22 <li><button></button></li> 23 <li><button></button></li> 24 <li><button></button></li> 25 </ul> 26 <script src="1-1.js"></script> 27 </body> 28 </html>
JS代码：
var liList = document.getElementsByTagName('li') for(var i=0; i<6; i++){ liList[i].onclick = function(){ alert(i) // 6，6，6，6，6，6 } }
结果：
分析：这种情况就是发生了变量污染，因为在onclick事件发生时for已经循环完了，所以i一直时6。
那应该怎么避免这种情况？当然是使用立即执行函数！
使用这个js代码：
1 var liList = document.getElementsByTagName('li') 2 for(var i=0; i<6; i++){ 3 (function(j){ 4 liList[j].onclick = function(){ 5 alert(j) // 0、1、2、3、4、5 6 } 7 })(i) 8 } 9 //避免了变量污染问题，使用立即执行函数创建了6个作用域，i被自动复制作为变量传递到形参里；