闭包是什么

闭包是什么？

• 闭包是一个函数
• 闭包可以使用在它外面定义的变量
• 闭包存在定义该变量的作用域中

各种专业文献上的"闭包"（closure）定义非常抽象，很难看懂。我的理解是，闭包就是能够读取其他函数内部变量的函数。

由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成"定义在一个函数内部的函数"。

---

变量作用域

变量可分为全局变量和局部变量。全局变量的作用域就是全局性的，在 js 的任何地方都可以使用全局变量。在函数中使用 var 关键字声明变量，这时的变量即是局部变量，它的作用域只在声明该变量的函数内，在函数外面是访问不到该变量的。

 var func = function(){
    var a = 'linxin';
    console.log(a);         // linxin
}
func();
console.log(a);             // Uncaught ReferenceError: a is not defined

作用域相对比较简单，我们不多讲，来看看跟闭包关系比较大的变量生存周期。

---

变量生存周期

全局变量，生命周期是永久的。局部变量，当定义该变量的函数调用结束时，该变量就会被垃圾回收机制回收而销毁。再次调用该函数时又会重新定义了一个新变量。

var func = function(){
    var a = 'linxin';
    console.log(a);
}
func();

a 为局部变量，在 func 调用完之后，a 就会被销毁了。

var func = function(){
    var a = 'linxin';
    var func1 = function(){
        a += ' a';
        console.log(a);
    }
    return func1;
}
var func2 = func();
func2();                    // linxin a
func2();                    // linxin a a
func2();                    // linxin a a a

可以看出，在第一次调用完 func2 之后，func 中的变量 a 变成 'linxin a'，而没有被销毁。因为此时 func1 形成了一个闭包，导致了 a 的生命周期延续了。

这下子闭包就比较明朗了。

• 闭包是一个函数，比如上面的 func1 函数

• 闭包使用其他函数定义的变量，使其不被销毁。比如上面 func1 调用了变量 a

• 闭包存在定义该变量的作用域中，变量 a 存在 func 的作用域中，那么 func1 也必然存在这个作用域中。

现在可以说，满足这三个条件的就是闭包了。

闭包的用途

闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。
怎么来理解这句话呢？请看下面的代码。

　　function f1(){

　　　　var n=999;

　　　　nAdd=function(){n+=1}

　　　　function f2(){
　　　　　　alert(n);
　　　　}

　　　　return f2;

　　}

　　var result=f1();

　　result(); // 999

　　nAdd();

　　result(); // 1000

在这段代码中，result实际上就是闭包f2函数。它一共运行了两次，第一次的值是999，第二次的值是1000。这证明了，函数f1中的局部变量n一直保存在内存中，并没有在f1调用后被自动清除。

为什么会这样呢？原因就在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2的存在依赖于f1，因此f1也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。

---

使用闭包的注意点

1）由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。

2）闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。

---

for (var i = 0; i < 4; i++) {
    setTimeout(function () {
        console.log(i)
    }, 0)
}
// 4 4 4 4

我们可能会简单的以为控制台会打印出 0 1 2 3，可事实却打印出了 4 4 4 4，这又是为什么呢？我们发现，setTimeout 函数时异步的，等到函数执行时，for循环已经结束了，此时的 i 的值为 4，所以 function() { console.log(i) } 去找变量 i，只能拿到 4。

我们想起上一个例子中，闭包使 a 变量的值被保存起来了，那么这里我们也可以用闭包把 0 1 2 3 保存起来。

for (var i = 0; i < 4; i++) {
   (function (i) {
       setTimeout(function () {
           console.log(i)
       }, 0)
   })(i)
}

当 i=0 时，把 0 作为参数传进匿名函数中，此时 function(i){} 此匿名函数中的 i 的值为 0，等到 setTimeout 执行时顺着外层去找 i，这时就能拿到 0。如此循环，就能拿到想要的 0 1 2 3。

实际上闭包的实现是这样的：

可以先看我作用域及作用域链这节

image.png
对这段代码，
image.png
a执行，然后定义了b,并把b给保存出来
然后a执行结束，把作用域链的第0位删除，但此时a的AO没有被垃圾回收，因为还有b的作用域链引用着它，如下图所示。
image.png
所以b被保存到外部之后，还可对a中的AO进行操作，即还可以访问函数a里的变量aaa，所以执行demo后，能打印出aaa,也可对aaa进行操作。
image.png

关于闭包的一道题

image.png
这道题中，就是使用了闭包，test函数执行完后，返回一个arr数组，arr数组里是存放着10个函数，在for一次次循环时，只会把一个function依次赋给arr中的每一项，而不会管这个function里面的东西是什么。
类似于 arr=[function() {document.write(i)},function() {document.write(i)},.....]
在外部 把arr赋给了myArr变量，然后又用了一个for循环来依次执行这10个函数，但此时 document.write[i]中拿到的i 已经为10.
i是test的作用域AO里的东西，当test执行完之后，i的值变为10，所以在外部执行函数时， 这里数组里的10个function拿到的i都为10，所以会依次打印出10个10

要想避免这种情况，可以用立即执行函数来处理

image.png

用一个立即执行函数把这个给arr赋值函数的操作给包裹起来，此时每一次for循环，它都会立即执行，并把此时的i赋值给j，保存起来，所以这次在外部执行myArr的时候，document.write打印的是j,它会去找j的值，j的值此时是0,1,2,3,4,5,6,7,8,9, 所以它会依次打印出这10个数，而不是上述的10个10.