JavaScript预编译

JavaScript的预编译过程总结为4步

1. 建立AO对象
2. 寻找形参和变量声明
3. 形参值与实参值相统一
4. 寻找函数声明

---

函数在执行以前会产生一个上下文对象，即Activeaction Object,简称AO对象。
AO对象初始为一个空对象，可是里面有一些隐含的默认属性，好比：this:window, arguments: []。
在预编译过程当中将会对该对象进行属性的添加等操做。
复制代码

下面举个例子来看一遍整个预编译过程

假若有如下代码：

function test (a, b) {
    console.log(a);
    function a () {};
    a = 10;
    console.log(a);
    function b () {};
    console.log(b);
    var b = 111;
    var a = 0;
}
test(2);
复制代码

接下来分别按照上面的4个步骤进行执行

1. 建立AO对象

//此时AO对象为
AO = {
    this: window,
    arguments: [],
    ...等隐含属性
}
复制代码

2. 寻找形参及变量声明

// 形参为a,b, 变量声明了a,b
// 此时AO对象为
AO = {
    // ...默认属性
    a: undefined,
    b: undefined,
}
复制代码

3. 形参值与实参值相统一

AO = {
    // ...默认属性
    a: 2,
    b: undefined,
}
复制代码

4. 寻找函数声明

AO = {
    // ... 默认属性
    a: function a () {},
    b: function b () {},
}
复制代码

至此预编译阶段完成，接下来将进行js的执行。

function test (a, b) {
    console.log(a);  // 此时AO对象中a为function a () {}
    function a () {};
    a = 10;     // 对a赋值为10
    console.log(a);  // 10
    function b () {};
    console.log(b);  // function b () {}
    var b = 111;    // 对b赋值为 111
    var a = 0;      // 对a赋值为 0
}
test(2);
复制代码

因此执行结果应该为

身为一名初入前端的菜鸟，但愿本身能够把成长的经历记录下来，以上为我的理解，若有不足，欢迎斧正。复制代码