【JS】预编译（图解）

预编译是js的一个特色，也算是闭包之前最难的一个知识点。预编译有4句公式，而这4句公式只要背熟就能理解预编译。这4句公式放在本文最末尾。本节篇幅比较长，要理解的东西也比较多。在学习预编译之前要记住下面这句话：JS的声明和执行(赋值)是分开两步操作的，声明属于预编译环节。

要了解预编译，就要先了解变量声明。变量声明又分为全局和局部。局部变量和作用域有关，稍后会讲到。

全局变量声明要记住2句话

1、任何变量，如果未经声明就赋值，此变量就为全局变量所有。

2、一切声明的全局变量，都是window的属性。

微信订阅号：Rabbit_svip

在Console可以看到输出的window里面，有变量a。

如果输出 window.a ，那就直接输出了123了。由此可以解析上面所说的全局变量的两句话。在全局声明的变量，称为全局变量。全局变量的作用域就是全局。局部变量的作用域通常是在函数内部。全局作用域称为GO，全称：Global Object。临时作用域成为AO，全称：Activation Object。而GO又可以理解为window这个对象。GO和AO要和JS的预编译一起理解。

【预编译公式】

1、创建GO/AO对象。

2、找形参和变量声明，将变量和形参名作为AO的属性名，值为undefined。

3、将实参值和形参统一。

4、在函数体里面找函数声明，值赋予函数体。

看下面的代码，理解GO和AO。

变量a是定义在全局上的变量。b是声明在全局上的函数。所以GO现在就有两个值，如下图所示。

在执行这段JS代码前，JS引擎会先把JS代码编译一遍。这个编译的过程就是定义作用域的过程。而最外层的作用域成为GO，GO里面现在就有a和b，而且值都是undefined。上图就是完成了【预编译公式】的前两句。由于这里是GO，所以第三句公式是不用管的。接下来就执行第4句公式。GO就变成下图所示。

这时b的值就是一个函数体。完成以上4句【预编译公式】后，GO就算是定义好了。当预编译完成后，代码会按顺序执行。这时执行第1行代码。所以a的值就变成123。第3-5行代码在JS运行时可以暂时忽略了。因为在预编译的时候已经提升了。所以接着就运行第7行代码。第7行代码运行后，就会执行第3-5行代码。由于第3-5行代码是一个函数体。所以这时又需要预编译一次。函数会创建一个AO。而且还会继承父函数的作用域下的所有东西。下图解析

函数b会产生一个AO，在这个过程中，函数b的AO首先会检查有没有形参，这里的形成是aa。还检测到定义了一个变量c。运行完【预编译公式】前两条，就形成上图所示的内容。接着会执行【预编译公式】第三条：将实参值和形参统一。所以aa的值这时就变成了123（在执行函数b的时候，从外面传了一个值给形参aa）。最后在函数b里面寻找函数声明。由于这里没有函数声明。所以最终会形成下图所示内容。