7.完全搞懂javascript-闭包

关于闭包的讨论的太多太多了，这里不讲晦涩难懂的概念。

咱们来想一个问题,

如何把函数的运行上下文保存下来？

啥？

function print() {
    var inFunction = 'inFunction';
    console.log(inFunction);
}

print()
复制代码

咱们知道在进入函数运行的时候，会建立函数的运行上下文，并放在栈顶：

当函数运行完毕，把函数运行上下文从运行栈中弹出：

你们会发现，对上次运行的函数时建立的词法环境的访问链路，断掉了，咱们找不到了，没法再引用函数词法环境里的变量（上图中红色框框所示）。

那有没有办法，把这个对这个词法环境的引用保存下来呢？

答案是有的。

咱们回忆一下：函数建立时会把建立函数时候的运行上下文的词法环境保存在函数对象的[[scope]]中。所以，若是咱们在函数运行的上下文建立一个函数，这个函数的[[scope]]就能够保存父级函数运行的时的词法环境了。像这样：

function print() {
    var inFunction = 'inFunction';
    console.log(inFunction);
    function inner() {
        var inFunction = inFunction;
    }
}

print()
复制代码

如上图，发现虽然能够经过内部函数的[[scope]]其访问 "失联"的词法环境，咱们发现，内部函数因为外部函数运行上下文的退出，也处于“失联”状态，咱们在全局上下文上没法访问内部函数。

其实很直观的，若是在全局上建立一个变量，并把内部函数返回给它，它不就能够经过全局变量访问内部函数了，进而能够访问外部函数那些“失联的词法环境”。

function print() {
    var inFunction = 'inFunction';
    console.log(inFunction);
    function inner() {
        var inFunction = inFunction;
    }
    
    return inner
}

var inner = print();
inner();
复制代码

以下图所示：

咱们发现，即便函数运行上下文退出了，咱们在全局环境中仍是能够访问到所退出的函数的词法环境。

更近一步思考：既然能够在函数内部返回一个函数对象给全局变量，能够保持对已经退出运行栈的运行上下文的词法环境的访问，若是咱们在函数内返回一个普通对象呢？把须要被全局环境访问的“东西”复制到对象上，而后把对象返回，咱们也能够在全局变量经过对象找到那些“失联”的信息。

function print() {
  var inFunction = 'inFunction';
  console.log(inFunction);
  function inner() {
      var inFunction = inFunction;
  }
  
  return {
    inFunction:inFunction,
    inner:inner
  }
}

var obj = print();
console.log(obj.inFunction);
复制代码

这就是闭包。

因此闭包，其实就是经过某种方式把把“失联”词法环境的引用引到全局环境来。由于这词法环境如今只有外围函数返回时提供的引用做为入口，只有一个洞能够进去，是一个密闭的空间，故而叫作闭包吧。

闭包，可让函数在运行完毕后，其运行时的上下文的词法环境仍然能被访问。