javascript的执行上下文—创建变量对象

执行上下文的创建时机：
当调用一个函数时（激活），一个新的执行上下文就会被创建。
执行上下文的生命周期
一个执行上下文的生命周期可以分为两个阶段，创建阶段和执行阶段。
创建阶段：

Paste_Image.png

执行阶段：

Paste_Image.png

注意：在检查变量声明阶段，如果遇到同名的变量名时，则直接跳过。因为同名的变量名可能是在检查函数声明时创建的，跳过是为了避免覆盖掉已声明的函数。

举个小例子，看一下上下文从创建到执行的过程。

(function demo(){
    console.log("执行前a的值为："+a);
    foo();
    function foo(){
        console.log("foo declare");
    }
    var foo = function(){
        console.log("foo expression");
    }
    foo();
    var a = 20;
    console.log("执行后a的值为："+a);
})()

//结果：
执行前a的值为：undefined
foo declare
foo expression
执行后a的值为：20

解析

1. 执行上下文创建：

demoEC = {
    // 变量对象
    VO: {},
    scopeChain: {},
    this: {}
}

创建变量对象阶段：

// VO 为 Variable Object的缩写，即变量对象
VO = {
    arguments: {...}, 
    foo: <foo reference>  // 表示foo的地址引用,var声明的foo变量会跳过不覆盖
    a: undefined
}

2. 执行阶段：

VO->AO   //变量对象变为活动对象
AO={
    arguments:{...},
    foo:<foo reference> //函数表达式赋值
    a:20
}

执行顺序：

(function demo(){
    function foo(){
        console.log("foo declare");
    }
    var a;
    console.log("a执行前的值为："+a);
    foo();
    foo = function(){
        console.log("foo expression");
    }
    foo();
    a = 20;
    console.log("a执行后的值为："+a);
})()