JavaScript的编译原理

尽管通常将 JavaScript 归类为“动态”或“解释执行”语言，但事实上它是一门编译语言。

这个事实对你来说可能显而易见，也可能你闻所未闻，取决于你接触过多少编程语言，具

有多少经验。但与传统的编译语言不同，它不是提前编译的，编译结果也不能在分布式系

统中进行移植。

尽管如此，JavaScript 引擎进行编译的步骤和传统的编译语言非常相似，在某些环节可能

比预想的要复杂。

作用域是什么 ｜ 5

在传统编译语言的流程中，程序中的一段源代码在执行之前会经历三个步骤，统称为“编

译”。

分词/词法分析（Tokenizing/Lexing） •

这个过程会将由字符组成的字符串分解成（对编程语言来说）有意义的代码块，这些代

码块被称为词法单元（token）。例如，考虑程序 var a = 2; 。这段程序通常会被分解成

为下面这些词法单元： var 、 a 、 = 、 2、; 。空格是否会被当作词法单元，取决于空格在

这门语言中是否具有意义。

分词（tokenizing）和词法分析（Lexing）之间的区别是非常微妙、晦涩的，

主要差异在于词法单元的识别是通过 有状态 还是 无状态 的方式进行的。简

单来说，如果词法单元生成器在判断 a 是一个独立的词法单元还是其他词法

单元的一部分时，调用的是有状态的解析规则，那么这个过程就被称为 词法

分析 。

解析/语法分析（Parsing） •

这个过程是将词法单元流（数组）转换成一个由元素逐级嵌套所组成的代表了程序语法

结构的树。这个树被称为“抽象语法树”（Abstract Syntax Tree，AST）。

var a = 2; 的抽象语法树中可能会有一个叫作 VariableDeclaration 的顶级节点，接下

来是一个叫作 Identifier （它的值是 a ）的子节点，以及一个叫作 AssignmentExpression

的子节点。 AssignmentExpression 节点有一个叫作 NumericLiteral （它的值是 2 ）的子

节点。

代码生成 •

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

息相关。

抛开具体细节，简单来说就是有某种方法可以将 var a = 2; 的 AST 转化为一组机器指

令，用来创建一个叫作 a 的变量（包括分配内存等），并将一个值储存在 a 中。

关于引擎如何管理系统资源超出了我们的讨论范围，因此只需要简单地了解

引擎可以根据需要创建并储存变量即可。

比起那些编译过程只有三个步骤的语言的编译器，JavaScript 引擎要复杂得多。例如，在

语法分析和代码生成阶段有特定的步骤来对运行性能进行优化，包括对冗余元素进行优化

等。

因此在这里只进行宏观、简单的介绍，接下来你就会发现我们介绍的这些看起来有点高深

的内容与所要讨论的事情有什么关联。

首先，JavaScript 引擎不会有大量的（像其他语言编译器那么多的）时间用来进行优化，因

为与其他语言不同，JavaScript 的编译过程不是发生在构建之前的。

对于 JavaScript 来说，大部分情况下编译发生在代码执行前的几微秒（甚至更短！）的时

间内。在我们所要讨论的作用域背后，JavaScript 引擎用尽了各种办法（比如 JIT，可以延

迟编译甚至实施重编译）来保证性能最佳。

简单地说，任何 JavaScript 代码片段在执行前都要进行编译（通常就在执行前）。因此，

JavaScript 编译器首先会对 var a = 2; 这段程序进行编译，然后做好执行它的准备，并且

通常马上就会执行它。