闭包

最新推荐文章于 2024-02-04 15:49:23 发布

石倩蓉

最新推荐文章于 2024-02-04 15:49:23 发布

阅读量354

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/shiqianrongcsdn/article/details/46990485

版权

javascript 专栏收录该内容

25 篇文章 1 订阅

订阅专栏

定义：函数嵌套函数，内部函数可以访问外部函数的变量和参数，外部函数的参数和变量不会被垃圾回收机制所收回。

好处：

一个变量可以长期驻扎在内存中

    //函数aa执行完后，变量a不会被立即回收，bb还会调用a

    function aa(){

             var a=1;

             return functionbb(){

                       alert(a);

             }

    }

    var cc=aa();

    cc();//2
不会污染全局变量

//可以实现变量a的累加，但是会污染全局变量

    var a=1

    function aa(){

             a++;

             alert(a);

    }

    aa();//2

    aa();//3

    //不能实现a的累加，在函数内部，虽然不会污染全局变量，但是变量a在函数执行完后会被回收，下次执行的时候会重新赋值。

    function aa(){

             var a=1;

             a++;

             alert(a);

    }

    aa();//2

    aa()//2

    //使用闭包可以实现a的累加，而且不会污染全局变量，外层函数执行完后a不会被回收

    function aa(){

             var a=1;

             return functionbb(){

                       alert(a);

             }

    }

    var cc=aa();

    cc();//2

    cc();//3
私有成员的存在

    //私有成员的存在

    var dd=(function aa(){

             var a=1;

             function bb(){

                       a++;

                       alert(a);

             }

             function cc(){

                       a++;

                       alert(a);

             }

             return {b:bb,c:cc}

    })();

    dd.b();//2

             dd.c();//3

用法：

模块化开发
在循环中找到对应元素的索引

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>闭包演示</title> 
<style type="text/css"> 
    p {background:gold;}  
</style> 
<script type="text/javascript">   
/*function init() { 
	var pAry = document.getElementsByTagName("p"); 
	for( var i=0; i<pAry.length; i++ ) { 
		pAry[i].onclick = function() { 
			alert(i); 
		} 
	} 
} 
//加一层闭包，返回一个函数作为事件响应
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		pAry[i].οnclick=(function(num){
			return function(){
				alert(num);
			}
		})(i);
	}
}
//加一层闭包，i以函数参数形式传给内层函数
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		(function(num){
			pAry[i].οnclick=function(){
				alert(num);
			}
		})(i);		
	}
}
//加一层闭包，i以局部变量形式传给内层函数
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		(function(){
			var num=i;
			pAry[i].οnclick=function(){
				alert(num);
			}
		})();		
	}
}
//将变量i保存在每个p对象的属性中
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		pAry[i].i=i;
		pAry[i].οnclick=function(){
			alert(this.i);
		}
	}
}
//将变量i保存在匿名函数自身的属性中
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		(pAry[i].οnclick=function(){
			alert(arguments.callee.i);
		}).i=i;
	}
}
//利用Function构造函数
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		pAry[i].οnclick=new Function("alert("+i+");");//new一次产生一个函数实例
	}
}
function init(){
	var pAry=document.getElementsByTagName("p");
	for(var i=0;i<pAry.length;i++){
		pAry[i].οnclick=Function("alert("+i+");");
	}
}*/
</script>   
</head>   
<body οnlοad="init();">   
<p>产品 0</p>   
<p>产品 1</p>   
<p>产品 2</p>   
<p>产品 3</p>   
<p>产品 4</p>   
</body>   
</html>

石倩蓉

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
闭包

闭包演示 p {background:gold;} /*function init() { var pAry = document.getElementsByTagName("p"); for( var i=0; i<pAry.length; i++ ) { pAry[i].onclick = function() { alert(i);
复制链接

扫一扫

专栏目录