浅谈我对Javascript闭包的认识

写在之前：如果要能畅通的阅读本文，至少你要了解【自执行函数】【隐式函数】是什么。

不得不说，Javascript中闭包的特性非常强大和复杂。想要理解它，确实不是一件很容易的事情。但有时候，我们只需要知道它是个什么东西、用在什么情况下也就基本够了。就比如你用手机打电话，你不是非得知道信息是如何传送的一样。所以，对于闭包我一直保持着这样一种心态：知道它什么时产生的、有何特征、如何使用就够了。下面，对于闭包，我说3句话，或许有助于初次接触的同学加深理解：

 

1、当内层函数引用了包围它的外层函数体内的变量时，就形成了闭包的一种形式。

也就是说：闭包可以让你在内层函数中引用包围它的外层函数体内的变量。而一个特例就是：有时候外层函数已经执行完了，可是内层函数却还没有开始执行或者没有执行完毕，此时，内层函数还可以使用外层函数的变量。如下面延迟显示消息的例子：

function delayAlert( message, time ) {

setTimeout( function() { alert( message ); }, time);

}

delayAlert("Hello,world!", 3000);

如上例，隐式声明的内层函数【 function() { alert( message ); } 】调用了delayAlert的函数参数message，这样就构成了一种闭包。

在执行 alert( message )的时候（此处注意它是包含在一个隐式的内层函数中的），delayAlert()函数本已经执行完毕了，但根据闭包的的特性，它会正常的显示Hello,world!这一部分信息，而不会显示一个'undefined'。

原因分析：一般情况下，函数执行完毕后，函数作用域内的变量所占的内存会被回收（或说释放）从而使局部变量失去作用。但因为内层函数还需要外层函数的变量（message），所以该变量（message）即使在外层函数执行完毕后也不能马上释放，否则内层函数将得不到正确的值或引用。

 

2、闭包可以避免大量使用全局变量的现象（至于为什么要避免大量使用全局变量的原因你懂的）

因为在javascript中，变量的作用域是函数范围内。所以我们可以这样做：把变量声明在一个自执行函数之内，然后在这个自执行函数内利用另一个函数来调用这个变量，这样这个变量不再是一个全局变量，但是它起到了与全局变量几乎相同的功效。下面是两段代码，第一段代码是使用全局变量实现，第二段代码是闭包形式：

代码段一（message是一个全局变量，需要注意变量名是否被重复定义）：

var message = 'hello,world';

window.onunload = function() { alert( message ); }

 

代码段二（message是一个局部变量，只需注意变量名在当前函数内是否重复定义）：

(function() {

var message = 'hello,world';

window.onunload = function() { alert( message ); }

})();

 

3、内层函数引用的是外层函数中变量的最终值，而不是初始值或中间变换的值。直接看一段出乎意料的代码：

 

以你的看法，上面的代码对li做了什么？点击后会发生什么事情？

 

 

 

 

 

上面的代码，也是一种闭包的形式，但无论你点击哪一项，都是弹出“我是第4项”。而我们的本意是要“我是第0项”……“我是第3项”。因此，刚好验证了上面所说的，闭包引用的是外层函数变量的最终值，而不是初始值或中间变换的值。是否有办法解决这样一种问题呢？当然有的，还是利用了闭包的原理：

可以肯定 i 在for循环中是正确的[0,1,2,3,4]，因为每个li项我们点击它都能触发行为。那么如果能把这个 i 的值[0,1,2,3]分别传入到onclick的函数体中去的话，问题就迎刃而解了。如何把i每次变换的值传入到onclick函数体内呢？方法还是使用闭包，即在for循环中再次增加一个自执行函数，并将当前的 i 作为自执行函数的参数传入，这样在onclick函数体内就可以正常的使用i了。

 

顺便说句：如果你对上面的函数体内的那些 i 有点头晕的话，你还需要对Javascript的变量作用域进一步的去了解。

 

闭包的概念确实很难掌握，以上3点只是我本人对闭包的一点初浅的理解，可以说未入门，但尽管如此，我也可以利用闭包做一小事情了。