深刻理解javascript原型和闭包（15）——闭包

前面提到的上下文环境和做用域的知识，除了了解这些知识以外，仍是理解闭包的基础。

至于“闭包”这个词的概念的文字描述，确实很差解释，我看过不少遍，可是如今仍是记不住。

可是你只须要知道应用的两种状况便可——函数做为返回值，函数做为参数传递。

第一，函数做为返回值

如上代码，bar函数做为返回值，赋值给f1变量。执行f1(15)时，用到了fn做用域下的max变量的值。至于如何跨做用域取值，能够参考上一节。

 

第二，函数做为参数被传递

如上代码中，fn函数做为一个参数被传递进入另外一个函数，赋值给f参数。执行f(15)时，max变量的取值是10，而不是100。

 

上一节讲到自由变量跨做用域取值时，曾经强调过：要去建立这个函数的做用域取值，而不是“父做用域”。理解了这一点，以上两端代码中，自由变量如何取值应该比较简单。（不明白的朋友必定要去上一节看看，这个很重要！）

 

另外，讲到闭包，除告终合着做用域以外，还须要结合着执行上下文栈来讲一下。

在前面讲执行上下文栈时（http://www.cnblogs.com/wangfupeng1988/p/3989357.html），咱们提到当一个函数被调用完成以后，其执行上下文环境将被销毁，其中的变量也会被同时销毁。

可是在当时那篇文章中留了一个问号——有些状况下，函数调用完成以后，其执行上下文环境不会接着被销毁。这就是须要理解闭包的核心内容。

我们能够拿本文的第一段代码（稍做修改）来分析一下。

 

第一步，代码执行前生成全局上下文环境，并在执行时对其中的变量进行赋值。此时全局上下文环境是活动状态。

 

第二步，执行第17行代码时，调用fn()，产生fn()执行上下文环境，压栈，并设置为活动状态。

 

第三步，执行完第17行，fn()调用完成。按理说应该销毁掉fn()的执行上下文环境，可是这里不能这么作。注意，重点来了：由于执行fn()时，返回的是一个函数。函数的特别之处在于能够建立一个独立的做用域。而正巧合的是，返回的这个函数体中，还有一个自由变量max要引用fn做用域下的fn()上下文环境中的max。所以，这个max不能被销毁，销毁了以后bar函数中的max就找不到值了。

所以，这里的fn()上下文环境不能被销毁，还依然存在与执行上下文栈中。

——即，执行到第18行时，全局上下文环境将变为活动状态，可是fn()上下文环境依然会在执行上下文栈中。另外，执行完第18行，全局上下文环境中的max被赋值为100。以下图：

 

第四步，执行到第20行，执行f1(15)，即执行bar(15)，建立bar(15)上下文环境，并将其设置为活动状态。

执行bar(15)时，max是自由变量，须要向建立bar函数的做用域中查找，找到了max的值为10。这个过程在做用域链一节已经讲过。

这里的重点就在于，建立bar函数是在执行fn()时建立的。fn()早就执行结束了，可是fn()执行上下文环境还存在与栈中，所以bar(15)时，max能够查找到。若是fn()上下文环境销毁了，那么max就找不到了。

使用闭包会增长内容开销，如今很明显了吧！

 

第五步，执行完20行就是上下文环境的销毁过程，这里就再也不赘述了。

 

闭包和做用域、上下文环境有着密不可分的关系，真的是“想说爱你不容易”！

另外，闭包在jQuery中的应用很是多，在这里就不一一举例子了。因此，不管你是想了解一个经典的框架/类库，仍是想本身开发一个插件或者类库，像闭包、原型这些基本的理论，是必定要知道的。不然，到时候出了BUG你都不知道为何，由于这些BUG可能彻底在你的知识范围以外。

 

到如今闭包就简单介绍完了，下一节咱们再总结一下。

---------------------------------------------------------------------------

本文已更新到《深刻理解javascript原型和闭包系列》的目录，更多内容可参见《深刻理解javascript原型和闭包系列》。

另外，欢迎关注个人微博。

学习做者教程：《前端JS高级面试》《前端JS基础面试题》《React.js模拟大众点评webapp》《zepto设计与源码分析》《json2.js源码解读》