江小鱼

# 作用域

# 作用域是什么

几乎所有的编程语言最基本的功能之一，就是能够存储变量当中的值，并且能在之后对这个值进行访问或修改，这些变量住在哪里？换句话说，它们存储在哪儿？最重要的是，程序需要时如何找到它们？

这些问题说明需要一套设计良好的规则来存储变量，并且之后可以方便地找到这些变量。这套规则被称为作用域

# 编译原理

通常将 JavaScript 归类为‘动态’或‘解释执行’语言，但事实上它是一门编译语言。在传统编译语言的流程中，程序中的在执行之前会经历三个步骤，统称为“编译”。

三个步骤：

  • 分词/词法分析（Tokenizing/Lexing）
  • 解析/语法分析（Parsing）
  • 代码生成
  • 分词 / 词法分析（Tokenizing/Lexing）

这个过程会将由字符组成的字符串分解成（对变成语言来说）有意义的代码块，这些代码块被称为词法单元（token）。例如，考虑程序 var a = 2;。这段程序通常会被分解成为下面这些词法单元： var、a、=、2、;。空格是否会被当做词法单元取决于空格在这门语言中是否具有意义。

  • 解析 / 语法分析（Parsing）

这个过程是将词法单元流（数组）转成一个有元素逐级嵌套组成的代表了程序语法结构的树。这个树被称为抽象语法树（Abstract Syntax Tree, AST）

var a = 2; 的抽象语法树中可能会有一个叫做 VariableDeclaration 的顶级节点，接下来是一个叫作 Identifier (它的值是2) 的子节点 ，以及一个叫作 AssignmentExpression 的子节点。 AssignmentExpression 节点有一个叫作 NumbericLiteral (它的值是2) 的子节点

  • 代码生成

将AST 转换成可执行代码的过程被称为代码生成。这个过程与语言、目标平台等息息相关

对于 JavaScript 来说，大部分情况下编译发生在代码执行前的几微秒（甚至更短）的时间内。在我们所有讨论的作用域背后，JavaScript 引擎用尽了各种办法（比如JIT，可以延迟编译甚至实施重编译）来保证性能最佳。

简单来说，任何 JavaScript 代码片段在执行前都要进行编译（通常就在执行前）。因此， JavaScript 编译器首先会对 var = 2; 这段程序进行编译，然后做好执行他的准备，并且通常马上就会执行他。

# 理解作用域

用一个例子针对 var a = 2; 来模拟整个过程

引擎

从头到尾负责整个JavaScript程序的编译以及执行过程

编译器

引擎的好朋友之一，负责语法分析以及代码生成等脏活累活

作用域

引擎的另一个好朋友，负责收集并维护由所有声明的标识符（变量）组成的一系列查询，并实施一套非常严格的规则，确定当前执行的代码对这些标识符的访问权限

当遇到 var a = 2; 引擎认为这里有两个完全不同的声明，一个由编译器在编译时处理，另一个则由引擎在运行时处理。将 var a = 2; 分解，编译器首先会将这段程序分解成词法单元，然后将词法单元解析成一个树结构。遇到 var a，编译器会询问作用域是否已经有一个该名称的变量存在于同一个作用域的集合中。如果是，编译器会忽略该声明，继续进行编译；否则它会要求作用域在当前作用域的集合中声明一个新的变量，并命名为 a。

接下来 编译器会为引擎生成运行时所需的代码，这些代码被用来处理 a = 2 这个赋值操作。引擎运行时会首先询问作用域，在当前作用域集合中是否存在一个叫做 a 的变量。如果是，引擎就会使用这个变量，并将 2 赋值给它；如果不是，引擎就会继续查找该变量，找不到引擎就会举手示意并抛出一个异常。

总结：

变量的赋值操作会执行两个动作，首先编译器会在当前作用域中声明一个变量（如果之前没有声明过），然后在运行时引擎会在作用域中查找该变量，如果能够找到就会对它赋值。

引擎是如何查找的呢？引擎会为变量a进行LHS和RHS查找。（赋值操作的左侧和右侧）。 LHS试图找到变量的容器本身，从而可以对其赋值。而RHS 查询与简单的查找某个变量的值别无二致。可以将RHS理解成取到他的值源，即得到某某的值。

举个例子：

console.log(a)
1

这是对 a 的RHS引用（取到他的值源），这里 a 并没有任何赋予值。相应的，需要查找并取得 a 的值，这样才能将值传递给 console.log()

a = 2
1

这里就是LHS，不关心当前值是什么，只是想要为 =2这个赋值操作找到一个目标

  • 赋值操作的目标是谁 LHS
  • 谁是赋值操作的源头 RHS

# 作用域嵌套

作用域是根据名称查找变量的一套规则。实际情况中，通常需要同时顾及几个作用域。当一个块或函数嵌套在另一个块或函数中时，就发生了作用域嵌套。因此在当前作用域中无法找到某个变量时，引擎就会在外层嵌套的作用域中继续查找，直到找到该变量，或抵达最外层的作用域（全局作用域）为止。

考虑如下代码

function foo (a) {
  console.log(a + b)
  b = a
}
foo(2)
1
2
3
4
5
6

RHS 查询在所有嵌套的作用域中遍寻不到所需要的变量，引擎就会抛出ReferenceError LHS 查询时，如果在顶层（全局作用域）中也无法找到目标变量，全局作用域中就会创建一个具有该名称的变量（非严格模式情况）

# 小结

作用域是一套规则，用于确定在何处以及如何查找变量（标识符）。如果查找的目的是对变量进行赋值那么就会使用 LHS 查询；如果目的是获取变量的值，就会使用 RHS 查询。

词法作用域 →