在网上看了很多关于闭包的讲解，都晦涩难懂，最近看到了阮一峰老师的文章，对闭包有了比较清晰的认识，现在把它整理出来。

一、变量的作用域

理解闭包之前，先要知道javascript的变量作用域 .
两种作用域：全局变量，局部变量.

javascript的特殊在于函数内部可以直接访问全局变量。

var n =10;
function f1(){
  console.log(n);
}
f1(); //10

当然在函数外部无法访问函数内的局部变量

function f1(){
  var n =10
}
console.log(n); //  n is not defined

还有一种情况是，在函数内部声明变量的时候，没有使用var命令，那么就实际上是声明了一个全局变量！这可能会造成全局变量污染，谨慎使用。

function f1(){
   n =10;
}
f1();
console.log(n); // 10

二、从外部如何获取局部变量？

在写代码的过程中，由于各种原因我们可能需要去读取函数内部的局部变量，但是正常情况下是做不到的，只有想另外的办法。
那就是在函数内部，再定义一个函数

function f1(){
  var n = 10;
  function f2(){
    consolo.log(n); //10
  }
}

上面的代码中，函数f2在函数f1内部，这时f1的局部变量对 f2是可见的，但是f2的局部变量对f1是不可见的。这就是javascript语言特有的链式作用域结构，子对象可以一级一级的向上寻找父对象的变量。所以父对象的所有变量对子对象是可见的，反之却不可以。

既然f2已经可以读取f1的变量，那么只要把f2作为返回值，那么我们不就可以在f1外部读取f2的变量了吗！

function f1 (){
  var n =10;
  return function f2(){
    console.log(n)
  }
}
var result = f1();
result(); // 10

三、闭包的概念

上一节代码中的f2就是闭包 。
闭包就是能够读取其他函数内部变量的函数。在javascript 里面只要函数内部的子函数可以读取局部变量，因此可以把闭包简单的理解为‘定义在函数内部的函数’。

所以本质上，闭包就是函数内部和函数外包连接起来的一个桥梁。

四、闭包的用途

有两个大的好处，一个是读取函数内部的变量，另一个就是让这些变量的值一直保存在内存中。

function f1(){
  var n =10;
  add = function (){
     n+=1;
  }
  function f2(){
    console.log(n);
  }
  return f2;
}
var result = f1();
result(); //10
add();
result(); // 11

在这段代码中，result其实就是局部函数f2。它一共运行了2次，一次是10，一次是11，这就证明了函数f1的局部变量一直保存在内存中，并没有在f2调用以后自动清除。
为什么会这样呢？原因在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2依赖于f1，因此f1也始终保存在内存中，不会在调用结束后，被垃圾回收站机制回收。 。

还有值得注意的地方是，add 函数没有使用var声明，因此add是一个全局变量。其次add 是一个匿名函数，而这个匿名函数本身就是一个闭包，可以在函数外部对函数内部的变量进行操作。

五、使用闭包的注意点

• 由于闭包会使得函数中的变量保存在内存中，内存消耗大，所以不能滥用闭包，否则会造成网页性能问题，还有可能导致内存泄漏。解决方法就是在退出函数之前，将不使用的局部变量全部删除。
• 闭包会在父函数外部改变父函数内部变量的值。所以如果把父函数当作对象使用时，把闭包当作它的公用方法，把内部变量当作私有属性时，这时一定要小心，不要随意改变父函数内部的变量值。

六、思考题

理解下面两段代码的运行结果，基本就算理解闭包的运行机制了。

var name = "The Window";
　　var object = {
　　　　name : "My Object",
　　　　getNameFunc : function(){
　　　　　　return function(){
　　　　　　　　return this.name;
　　　　　　};
　　　　}
　　};
 alert(object.getNameFunc()()); //The window

var name = "The Window";
　　var object = {
　　　　name : "My Object",
　　　　getNameFunc : function(){
　　　　　　var that = this;
　　　　　　return function(){
　　　　　　　　return that.name;
　　　　　　};
　　　　}
　　};
　alert(object.getNameFunc()());  //My Object