Javascript闭包

来源：互联网发布：交通事故数据2015年编辑：程序博客网时间：2024/05/18 12:05

1、将变量 i 保存给在每个段落对象（p）上

1function init1() { 
2  varpAry = document.getElementsByTagName("p"); 
3  for(var i=0; i<pAry.length; i++ ) {
4     pAry[i].i = i;
5     pAry[i].onclick =function() {
6        alert(this.i); 
7     }
8  } 
9}

2、将变量 i 保存在匿名函数自身

1function init2() { 
2  varpAry = document.getElementsByTagName("p"); 
3  for(var i=0; i<pAry.length; i++ ) {
4   (pAry[i].onclick =function() {
5        alert(arguments.callee.i);
6    }).i = i;
7  } 
8}

后又想到了三种

3、加一层闭包，i 以函数参数形式传递给内层函数

01function init3() { 
02  varpAry = document.getElementsByTagName("p");
03  for(var i=0; i<pAry.length; i++ ) {
04   (function(arg){
05       pAry[i].onclick =function() {
06          alert(arg);
07       };
08   })(i);//调用时参数 
09  } 
10}

4、加一层闭包，i 以局部变量形式传递给内层函数

01function init4() { 
02  varpAry = document.getElementsByTagName("p");
03  for(var i=0; i<pAry.length; i++ ) { 
04    (function() { 
05      vartemp = i;//调用时局部变量 
06      pAry[i].onclick =function() {
07        alert(temp);
08      }
09    })();
10  } 
11}

5、加一层闭包，返回一个函数作为响应事件（注意与3的细微区别）

01function init5() { 
02  varpAry = document.getElementsByTagName("p");
03  for(var i=0; i<pAry.length; i++ ) {
04   pAry[i].onclick =function(arg) {
05       returnfunction() {//返回一个函数 
06       alert(arg);
07     }
08   }(i);
09  } 
10}

后又发现了两种

6、用Function实现，实际上每产生一个函数实例就会产生一个闭包

1function init6() { 
2    varpAry = document.getElementsByTagName("p");
3    for(var i=0; i<pAry.length; i++ ) {
4      pAry[i].onclick =new Function("alert("+ i + ");");//new一次就产生一个函数实例
5    }
6}

7、用Function实现，注意与6的区别

1function init7() { 
2    varpAry = document.getElementsByTagName("p");
3    for(var i=0; i<pAry.length; i++ ) {
4         pAry[i].onclick = Function('alert('+i+')');
5    }
6}