JavaScript执行上下文之执行上下文栈

JavaScript中每一个函数在运行期间都会创建一个执行上下文（execution context），执行上下文对象中存储了以下属性：

• 变量对象（Variable Object）
• 作用域链（Scope Chain）
• this

执行上下文栈

JavaScript中每一个函数在运行期间都会创建一个执行上下文（execution context），那么如何管理这么多执行上下文呢？JavaScript通过执行上下文栈来管理众多的执行上下文。

下面我们模拟执行上下文栈的行为。首先定义一个数组来代表执行上下文栈：

ECStack = [];

JavaScript开始解释执行代码的时候，必然得先向执行上下文栈中压入全局上下文，并且直到整个应用程序结束才弹出这个全局上下文：

ECStack = [
    globalContext
];

下面是一段函数调用代码：

function fun3() {
    console.log('fun3')
}

function fun2() {
    fun3();
}

function fun1() {
    fun2();
}

fun1();

当执行一个函数的时候，就会创建一个执行上下文，并且压入执行上下文栈，当函数执行完毕的时候，就会将函数的执行上下文从栈中弹出。知道了这样的工作原理，让我们来看看如何处理上面这段代码：

// fun1()
ECStack.push(<fun1> functionContext);

// fun1中竟然调用了fun2，还要创建fun2的执行上下文
ECStack.push(<fun2> functionContext);

// 擦，fun2还调用了fun3！
ECStack.push(<fun3> functionContext);

// fun3执行完毕
ECStack.pop();

// fun2执行完毕
ECStack.pop();

// fun1执行完毕
ECStack.pop();

// javascript接着执行下面的代码，但是ECStack底层永远有个globalContext

参考文章

• https://github.com/mqyqingfeng/Blog/issues/4