JavaScript 闭包如何工作？

在今天的文章中，我们将探讨JavaScript中的一个重要概念：闭包。本文通过一个简单的代码示例，带你一步一步了解什么是闭包，它是如何工作的，以及它在JavaScript中为什么如此重要。

数据与代码

数据：数据是事实的集合，可以是数字、词汇、测量值、观察结果或者对事物的描述。你无法触摸、闻到或品尝到数据，但你可以书写、听到或用计算机创造出感觉它的行为。数据经过编程可以变得非常有用。

代码：上面的所有文字称为代码，它是用JavaScript语言编写的。

JavaScript：JavaScript是一种编程语言，就像英文、法文或中文一样。计算机或电子设备理解不同的编程语言。为了让计算机理解JavaScript，需要一个解释器。常见的JavaScript解释器是浏览器。

浏览器与函数

浏览器：当你使用计算机、平板或手机连接互联网访问网站时，用到的就是浏览器。常见的浏览器包括Internet Explorer、Chrome、Firefox和Safari。浏览器可以理解JavaScript并告诉计算机需要做什么。JavaScript的指令称为函数。

函数：JavaScript中的函数就像工厂，可以是一个小工厂，也可能包含许多子工厂，每个子工厂都有自己负责的任务。真实世界中的工厂加工布料和线制造T恤和牛仔裤，而JavaScript的工厂处理数据。

代码示例解析

让我们来看一段代码：

function sing(person) {
  var firstPart = 'There was ' + person + ' who swallowed '

  var fly = function () {
    var creature = 'a fly'
    var result = "Perhaps she'll die"
    alert(firstPart + creature + '\n' + result)
  }

  var spider = function () {
    var creature = 'a spider'
    var result = 'that wiggled and jiggled and tickled inside her'
    alert(firstPart + creature + '\n' + result)
  }

  var bird = function () {
    var creature = 'a bird'
    var result = 'How absurd!'
    alert(firstPart + creature + '\n' + result)
  }

  var cat = function () {
    var creature = 'a cat'
    var result = 'Imagine That!'
    alert(firstPart + creature + '\n' + result)
  }

  fly()
  spider()
  bird()
  cat()
}

var person = 'an old lady'

sing(person)

函数与变量

我们的代码以function开始，这表明它是一个函数。然后是函数的名称sing，这是我对函数内容的描述。括号()始终出现在函数名称后，有时是空的，有时包含某些内容。在这里，它包含一个单词(person)。然后有大括号{}，标志着函数的开始和结束。

在代码的后面部分，有如下行：

var person = 'an old lady'

变量：var代表变量。变量就像一个信封，外部标记为person，内部包含信息"an old lady"。

全局变量：‘person’ 是一个全局变量，这意味着如果你改变其值，这个变量将在整个代码中保持这种新值。

闭包

闭包：闭包是嵌套在主函数内部的小函数。这些小工厂都有自己的大括号，意味着它们的变量无法从外部看到。这就是为什么变量creature和result可以在不同闭包内重复使用。闭包都知道主函数的变量firstPart是什么，因为它们可以从内部看到外部。

功能调用

在主函数结尾处，我们有以下行：

fly()
spider()
bird()
cat()

这些行将按顺序调用这些闭包函数，完成sing()函数的工作。

总结

通过这个简单的例子，我们希望你能理解JavaScript中的闭包是如何工作的。闭包在许多真实的编程场景中非常有用，理解它们的工作方式将极大帮助你提升编程技巧。