Javascript闭包

 

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

1	function init1() {

2	var pAry = 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 保存在匿名函数自身

1	function init2() {

2	var pAry = 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 以函数参数形式传递给内层函数

01	function init3() {

02	var pAry = 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 以局部变量形式传递给内层函数

01	function init4() {

02	var pAry = document.getElementsByTagName("p");

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

04	(function () {

05	var temp = i;//调用时局部变量

06	pAry[i].onclick = function() {

07	alert(temp);

08

}

09

})();

10

}

11

}

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

01	function init5() {

02	var pAry = document.getElementsByTagName("p");

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

04	pAry[i].onclick = function(arg) {

05	return function() {//返回一个函数

06	alert(arg);

07

}

08

}(i);

09

}

10

}

后又发现了两种

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

1	function init6() {

2	var pAry = 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的区别

1	function init7() {

2	var pAry = document.getElementsByTagName("p");

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

4	pAry[i].onclick = Function('alert('+i+')');

5

}

6

}