前端面试之JavaScript基础（五）—— 闭包

闭包 是一个在 JavaScript 当中比较生涩的知识，它好像一直被一层迷雾笼罩，让人好像理解了又说不上具体是什么。我查看了许多关于讲解闭包的材料，其中有两种对于闭包的解释我认为比较容易被接受：

• 当创建它的上下文被销毁后，仍能引用该上下文作用域当中的 自由变量 的 函数 称为闭包。
• 当 函数 离开被定义时所处的词法作用域仍可以 记住并访问 所在作用域环境，这时就产生了闭包。

根据上面的两种说法，我们看到关键的词汇是 函数 和 作用域 ，接下来我们通过例子来更清晰的认识闭包，示例如下：

function foo() {
  var a = 'foo'
  return function baz() {
    console.log(a)
  }
}

var bar = foo()

bar() // foo

结合上面两种闭包概念，我将上方的示例执行步骤分解如下：

1. 从执行角度看， foo 函数执行引擎会创建相应的 上下文对象，上下文对象当中包含了作用域的相关信息，记录了当前作用域当中存在标识符 a 和 baz ，return 语句会将 baz 函数向外传递；
2. 赋值语句结束后函数 foo 的执行就终止了，此时引擎会 回收 函数执行时的上下文对象。上下文对象被回收，也代表作用域当中的标识符会随之消失（正常情况下）。
3. 函数 baz 离开 了被定义时的词法作用域，在全局作用域当中通过函数别名的方式调用。此时它需要寻找一个变量 a ，遵循词法作用域的变量查找规则最终打印出了 foo 作用域当中 a 变量的值。

上面的分析中本应该被销毁的变量 a 被神奇的保留了下来，我们可以将这种现象或是机制理解为闭包。

总结一下，闭包的机制是由函数和词法作用域的查询方式来实现的。我将它理解为：

当 函数 在 被定义时的词法作用域以外 的地方 被调用 时，仍然能够 访问 定义时的作用域的行为就称为 闭包 。

闭包无处不在

其实闭包在我们日常编写的程序中无处不在，只是你并不是有意识的认知并将其定义为一个闭包，其中典型的例子就是 回调函数 ，请看以下代码：

function foo() {
  var isShow = true
  setTimeout(() => {
    isShow = false
    console.log(isShow)
  }, 1000)
}

foo()

上面的代码当中传入 setTimeout 的回调函数其实就是闭包的体现，在 1000 毫秒过后它所执行的环境已经不是函数 foo 产生的环境，但是它仍然能够引用当时的词法作用域。

诸如此类例子还有许多，事件、Ajax请求、通信等等其实都是闭包的应用。

小结

今天直接上结论：

1. 闭包：当 函数 在 被定义时的词法作用域以外 的地方 被调用 时，仍然能够 访问 定义时的作用域的机制称为闭包。
2. 闭包并不是高深的理论，在实际编码中回调函数、事件、请求、通信等等常用的技巧当中都有闭包的应用。