javascript 闭包的理解
javascript中的作用域、闭包是一个不好理解的概念，需要慢慢领悟。现在把我自己学习作用域、闭包所理解的东西分享一下。
要领悟闭包必需理解javascript变量的作用域问题。
看下面代码1
var str="test"; //定义str
if(true){
var str="hello"; //定义str
}
alert(str);会打印输出什么：test 还是 hello？
你会看到hello
看下面代码2
var str="test"; //定义str
function a(){
if(true){
var str="hello"; //定义str
}
}
a();
alert(str);会打印输出什么：test 还是 hello？
你会看到test
让我明白：代码1与代码2比较一下可以看到代码2多了一个function，在javascript中一直描述作用域“函数级”，在a()同定义了一个str，作用域就在a()函数内，与外面定义str没有关系。
我们在学习javascript的时候变量有：全局变量和局部变量
这里提到的全局变量与函数级作用域也有关系。
------------------------------------- ------------------------------------- -------------------------------------
看下面代码3
var str="test"; //定义str
alert(str==window.str)会打印输出什么：true还是false?
你会看到true
看下面代码4
function a(){
str="test";
}
a();
alert(str==window.str)会打印输出什么：true还是false?
你会看到true
让我明白：定义全局变量的两种方式：1.不定义在函数内，2.在fun中不加关键字var，所有的全局变量都是window对象的属性。
------------------------------------- ------------------------------------- -------------------------------------
看下面代码5
(function(){
var str="test";
if(true){
var str="hello";
}
alert(str);
alert(str==window.str);
})()会打印输出什么：test还是hello? true 还是false?
你会看到hello,false;
让我明白：代码5与代码1看上去很像，但本质已经变了，代码中已经包装了一个匿名函数，既然是函数，那么里面的变量都是函数级的了，使用var定义的str就是函数级的变量，作用范围只能在匿名函数中。而window现在根本没有str这个属性。你可以尝试使用alert(window.str)，你会看到undefined，因为str根本不存在。
关于闭包要理解作用的基础上去理解闭包。
也许闭包的说法很多，但我个人觉得《精通javascript》的说法我能更好的理解：闭包意味着内层的函数可以引用存在于包围它的函数内的变量，即使外层函数的执行已经终止。从文字上去理解真是有些困难。
------------------------------------- ------------------------------------- -------------------------------------
看下面代码6
<button id="btnAdd">+</button>
var btnAdd = document.getElementById("btnAdd");
function addNum(){
var num=0;
return function(){
alert(num++);
}
}
btnAdd.onclick = addNum();连续点击button会怎么样呢？
第一次点击弹出：0
第二次点击弹出：1
第三次点击弹出：2
第四次点击弹出：3
...
会延续下去。
为会呢？
让我明白：原来上面是一个闭包，内层函数是一个return 的匿名函数，这个匿名函数去访问包围它的addNum变量num。当在执行btnAdd.onclick = addNum();addNum()就已经终止了，当我们点击button的时候还在访问变量num，也就意味着点击button的时候只执行了这个匿名函数，外层函数没有执行。
------------------------------------- ------------------------------------- -------------------------------------
看下面代码7
<ul>
<li><a href="">aa1</a></li>
<li><a href="">aa2</a></li>
<li><a href="">aa3</a></li>
<li><a href="">aa4</a></li>
</ul>var aArg = document.getElementsByTagName("a");
for(var i=0;i<aArg.length;i++){
aArg[i].onclick = function () {
alert(i);
}
}以上代码会怎么样呢？不管你点击aa1还是aa2还是aa3还是aa4都会统一弹出：4，
是这为什么呢？
上面是一个闭包，但我们在点击的时候代码已经执行完成，代码执行完成后i的值是4 。所以一直会弹4。（闭包允许你引用父函数中的变量，但提供的值并非该变量创建时的值，而是父函数范围内的最终值）。
明白这一点所以我们必须创建一个作用域来保存每次for循环时i的值。
看下面代码8
var aArg = document.getElementsByTagName("a");
for (var i = 0; i < aArg.length; i++) {
(function () {
var index = i;
aArg[i].onclick = function () {
alert(index);
}
})()
}代码8中有一个立即执行函数，来保存i的值。
这样点aa1的时候，弹出0
这样点aa2的时候，弹出1
这样点aa3的时候，弹出2
这样点aa4的时候，弹出3
理解好作用域与闭包我们可以简化很多工作，javascript里面有很多细节的东西，学会javascript是简单的事情，但想学习好有很长的路要走。有兴趣的朋友加QQ:460666546