JavaScript之预编译学习(附带多个面试题)

前言

在学习JavaScript预编译之前，先了解一下JavaScript从编译到执行的过程，大致分为四步：

1. 词法分析
2. 语法分析：检查代码是否存在错误，若有错误，引擎会抛出语法错误。同时会构建一颗抽象语法树(AST)。
3. 预编译
4. 解释执行

预编译

JavaScript是解释性语言，也就是说，编译一行，执行一行，但js并非上来就进入编译环节，它在编译之前存在预编译过程。

js中预编译一般有两种：全局的预编译和函数的预编译，分别发生在script内代码执行前和函数的执行前。

函数预编译

首先来看一个例子：

function test(a) {
    console.log(a);       
    var a = 123;
    console.log(a);       
    function a() {}
    console.log(a);       
    var b = function() {}
    console.log(b);       
    function d() {}
}
test(1)

就以上述例子中的a为例，有形参a，变量a，函数a，那test函数执行时，此时的a到底是什么呢？

输出结果：

? a() {}
123
123
? () {}

要想弄明白最终的输出结果，就不得不好好学习一下预编译的详细过程。

在预编译学习中，经常听到一句话：函数声明整体提升，变量声明提升。

这句话可以解决大多数场景下的预编译问题，但光凭这句话无法理解透预编译，接下来我们来一起捋一下函数预编译的大致流程。

函数预编译四部曲

1. 预编译开始，会建立AO(Activation Object)对象
2. 找形参和变