最近在学习前端知识,看到javascript闭包这里总是云里雾里。于是翻阅了好多资料记录下来本人对闭包的理解。
首先,什么是闭包?看了各位大牛的定义和描述各式各样,我个人认为最容易一种说法:
外部函数执行完成之后,内部函数依然可以访问外部函数的成员变量。这种现象叫做闭包
看看下面的代码:
function a () {
var temp = "hello world";
function b () {
alert(temp);
}
return b;
}
var test = a();
test();
这是一个经典闭包例子,b在执行的时候,a已经执行过了,但是b() 依然会返回
"hello world"
,b函数是用了a函数的成员变量这就是闭包。
还有一个典型案例这里需要说明下:
html代码:
<div id="divTest">
<span>0</span> <span>1</span> <span>2</span> <span>3</span>
</div>
js代码:
var spans = $("#divTest span");
for (var i = 0; i < spans.length; i++) {
spans[i].onclick = function () {
alert(i);
}
}
结果是每个span点击都弹出4,并不是我们想象的0,1,2,3
这因为在实际点击的时候还是能访问外部函数(外部函数已经执行结束,但是没有被销毁)的成员变量i,
由于每次外部函数在执行的时候都会重建作用域链中的变量,所以会发现循环了4次i之后,每个span的点击都是4。
一般解决这种闭包问题就是把公用的变量变成自己的,所以这样就这么解决。
var spans = $("#divTest span");
for (var i = 0; i < spans.length; i++) {
spans[i].onclick = function () {
var x = i;
alert(x);
}
}
这样大家都不公用父函数的,而是用自己的就正常了。
关于作用链只要记住以下几点就可以啦:
1.javascript中全局变量不能访问局部的变量,局部变量可以访问全局变量。
2.在局部中使用变量,如果当前函数中没有该变量,解析器会自动去父级作用域中寻找,如果父级没有会继续寻找更上一级的作用域,直到找到全局作用域如果还没有则返回undefined。
3.作用链就是逐级向上找的一个过程。