javascript深入了解(闭包)

目标:深入了解闭包的原理;
实现方式:代码及相关文字解释,请逐步运行代码并理解里面每句的含义。

闭包:原理是指有权访问另一个函数作用域中的变量的函数。如下面的例子:
var name = 'fanlizhi';
function callName(){
	var age = '22';
	alert(name);
	alert(age);
}
callName('fanlizhi');//fanlizhi/22
这个就是闭包,函数里面能够访问到age,也可以访问到函数外面的name.其实这只是最简单的闭包,但是原理都是一样的,当函数里面嵌套函数就变得没那么容易理解了,其实理解闭包最主要的是理解作用域链,这个我在前面的javascript深入理解(作用域)中已经说的很多了,这些也是理解闭包的基础。当我们调用一个函数,他会创建一个作用域链,当函数用完就会销毁作用域链,但是当我们将函数赋值给一个变量后,由于变量存在于外部环境,他也有自己属于的作用域链,所以在这个变量销毁之前也会保存原来函数中所需要的作用域。
function count(){
	for(var i=0; i<10; i++){
	}
	alert(i);
}
count();//10
这个我前面javascript深入理解(作用域)中也讲过为什么i最后是10,原因是当前作用域(活动对象),只有一个i,它的值是公用的,当叠加后因为是同一个i所以最后是10,那么我们再看看闭包后的情况:
function count(){
	var a =[];
	for(var i=0; i<10; i++){
		a[i] = function(o){
			return function(){
				alert(o);
			};
		}(i)
	}
	return a;
}
var a = count();
for(var i=0; i<10; i++){
	a[i]();//[0,1,2,3,4,5,6,7,8,9]
}
这里我们定义了一个数组a,然后每次执行循环里面都会调用a[i] = function(o){return function(){alert(o)};}(i); 我们这里将一个function 赋值给数组a,每进一次function都会传递进一个i的值,并返回一个function和该function的作用域链,这个作用域链包含了第二层作用域链中的i的值也就是o的值,这里的o的值被我们封装一层后成为了单独的值o而不是公用的i。我们来变形一下可能更加清楚了:
function count(){
	var a =[];
	var fun =	function(i){
					return function(){
						alert(i);
					}
				}
	for(var i=0; i<10; i++){
		a[i] = fun(i);		
	}
	return a;
}
var a = count();
alert(a);//functions 数组
for(var i=0; i<10; i++){
	a[i]();//[0,1,2,3,4,5,6,7,8,9]
}
这里我们再函数内部定义了一个方法,然后每循环一次都调用这个方法并将值返回给a数组,然后返回a,这里剔除掉了上面o的干扰可能更加清晰,我们还打印了a,发现里面存的全是function,这也印证了,我们返回的不仅仅是function,还有他们各自的作用域链中的i的值。这个归咎于我们多次的将方法赋值给变量,让他们不断的成为拥有更大作用域的变量的值,来保存他们各自的作用域链不被销毁。
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值