漫谈闭包

什么是闭包？

红宝书定义： 闭包是指有权访问另外一个函数作用域中变量的函数

MDN闭包定义： 闭包是指那些能够访问自由变量的函数。

闭包产生的原因？

理解闭包，首先要明白作用域的概念，在ES5中只存在两种作用域-全局作用域和函数作用域，当访问一个变量时，解释器会首先在当前作用查找标识符，如果没有找到，就去父作用域找，直到找到该变量的标示符不在父作用域中，这就是作用域链，每个子函数会拷贝上级的作用域，形成一个作用域链条。
如：

var a = 1;
function f1() {
  var a = 2;
  function f2() {
    var a = 3;
    console.log(a); //3
  }
}

这段代码中，f1的作用域指向有全局作用域和它本身，而f2的作用域指向全局作用域，f1和它本身。作用域是从最底层向上找，直到找到全局作用域为止，如果全局还没有的话就报错。

闭包产生的本质就是当前环境中存在指向父级作用域的引用。如：

function f1(){
  var a = 2;
  function f2() {
    console.log(a); // 2   
 }
 return f2;
}
var x = f1();
x(); // 2

这里x会拿到父级作用域中的变量，输出2，因为在当前环境中，含有对f2的引用，f2恰恰引用了window，f1，和f2的作用域。因此f2可以访问到f1的作用域的变量。

白话解读闭包

很多书籍上闭包的概念很抽象，很难理解，简单说闭包就是可以读取其他函数内部变量的函数。由于JS语言中，只有函数内部的子函数才可以读取外部的局部变量，因此可以把闭包简单理解为“定义在一个函数内部的函数”

闭包的用途

• 读取函数内部的变量
• 保存变量的引用，让这些变量的值始终保持在内存中

function f1(){

　　　　var n=999;

　　　　nAdd=function(){n+=1}

　　　　function f2(){
　　　　　　alert(n);
　　　　}

　　　　return f2;

　　}

　　var result=f1();

　　result(); // 999

　　nAdd();

　　result(); // 1000

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

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

这段代码中，“nAdd=function(){n+=1}”这一行，nAdd前面没有使用var关键字，因此nAdd是一个全局变量，而不是局部变量。其次nAdd的值是一个匿名函数，而这个匿名函数本身也是一个闭包，所以nAdd相当于一个setter，可以在函数外部对函数内部的局部变量进行操作。

如何解决下面的循环输出问题？

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

为什么会全部输出6？
setTimeout为宏任务，由于JS中单线程eventLoop机制，在主线程同步任务执行完后才去执行宏任务，因此循环结束后setTimeout中的回调才依次执行，但输出i的时候当前作用域没有，往上一级再找，发现了i,此时循环已经结束，i变成了6。因此会全部输出6。

• 解法1：利用IIFE(立即执行函数表达式)当每次for循环时，把此时的i变量传递到定时器中

 for(var i = 1;i <= 5;i++){
  (function(j){
    setTimeout(function timer(){
      console.log(j)
    }, 0)
  })(i)
}

• 解法2：给定时器传入第三个参数, 作为timer函数的第一个函数参数

for(var i=1;i<=5;i++){
  setTimeout(function timer(j){
    console.log(j)
  }, 0, i)
}

• 解法3

for(let i = 1; i <= 5; i++){
  setTimeout(function timer(){
    console.log(i)
  },0)
}

使用闭包的注意点

1. 由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。
2. 闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。