执行上下文:指当前执行环境中的变量、函数声明,参数(arguments),作用域链,this等信息。分为全局执行上下文、函数执行上下文,其区别在于全局执行上下文只有一个,函数执行上下文在每次调用函数时候会创建一个新的函数执行上下文。
执行上下文的组成代码示例:
const ExecutionContextObj = {
VO: window, // 变量对象
ScopeChain: {}, // 作用域链
this: window
};
执行上下文的组成图例示例: cdn.boblog.com/execution-c…
执行上下文生命周期
变量对象是与执行上下文相关的数据作用域,存储了上下文中定义的变量和函数声明。
变量对象式一个抽象的概念,在不同的上下文中,表示不同的对象:
全局执行上下文的变量对象
执行上下文栈 执行上下文栈的作用是用来跟踪代码的,由于JS是单线程的,每次只能做一件事情,其他的事情会放在指定的上下文栈中排队等待执行。
JS解释器在初始化代码的时候,首先会创建一个新的全局执行上下文到执行上下文栈顶中,然后随着每次函数的调用都会创建一个新的执行上下文放入到栈顶中,随着函数执行完毕后被执行上下文栈顶弹出,直到回到全局的执行上下文中。(栈:一种数据结构,遵循后进先出的原则)。
代码示例:
function getName() {
const year = getYear();
const name = 'Lynn';
console.log(`${name} ${year} years old this year`);
}
function getYear() {
return 18;
}
getName();
复制代码
执行上下文栈图例:
上面的执行上下文栈执行过程:
1.首先创建了全局执行上下文,当前全局执行上下文处于活跃状态。
2.全局代码中有2个函数 getName 和 getYear,然后调用 getName 函数,JS引擎停止执行全局执行上下文,创建了新的函数执行上下文,且把该函数上下文放入执行上下文栈顶。
3.getName 函数里又调用了 getYear 函数,此时暂停了 getName 的执行上下文,创建了 getYear 函数的新执行上下文,且把该函数执行上下文放入执行上下文栈顶。
4.当 getYear 函数执行完后,其执行上下文从栈顶出栈,回到了 getName 执行上下文中继续执行。
5.当 getName 执行完后,其执行上下文从栈顶出栈,回到了全局执行上下文中。