JavaScript: ----深入理解JS执行上下文

什么是执行上下文:

简单来说,执行上下文就是js解析器在(全局代码/函数/eval代码)执行前做的“准备工作”

具体过程就是,在将(全局代码/函数/eval代码)压入栈中执行之前,js解析器会对应的先创建一个执行上下文并将其压入执行栈,在(全局代码/函数/eval代码)执行完毕之后,再将其对应的执行上下文从栈中弹出

模拟执行过程:

为了模拟执行上下文栈的行为,让我们定义执行上下文栈是一个数组:

ECStack = [];

试想当 JavaScript 开始要解释执行代码的时候,最先遇到的就是全局代码,所以初始化的时候首先就会向执行上下文栈压入一个全局执行上下文,我们用 globalContext 表示它,并且只有当整个应用程序结束的时候,ECStack 才会被清空,所以程序结束之前, ECStack 最底部永远有个 globalContext:

ECStack = [
    globalContext
];

 现在 JavaScript 遇到下面的这段代码了:

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

猜你喜欢

转载自www.cnblogs.com/chenmoumou/p/10723872.html
今日推荐