🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] # 执行上下文栈 每次当控制器转到可执行代码的时候,就会进入一个执行上下文。执行上下文可以理解为当前代码的执行环境,它会形成一个作用域。JavaScript中的运行环境大概包括三种情况。 * 全局环境:JavaScript代码运行起来会首先进入该环境 * 函数环境:当函数被调用执行时,会进入当前函数中执行代码 * eval 因此在一个JavaScript程序中,必定会产生多个执行上下文,JavaScript引擎会以堆栈的方式来处理它们。栈底永远都是全局上下文,而栈顶就是当前正在执行的上下文。 当代码在执行过程中,遇到以上三种情况,都会生成一个执行上下文,放入栈中,而处于栈顶的上下文执行完毕之后,就会自动出栈。 ~~~ var color = 'blue'; function changeColor() { var anotherColor = 'red'; function swapColors() { var tempColor = anotherColor; anotherColor = color; color = tempColor; } swapColors(); } changeColor(); ~~~ 全局上下文在浏览器窗口关闭后出栈。 > 注意:函数中,遇到return能直接终止可执行代码的执行,因此会直接将当前上下文弹出栈。 ![](https://upload-images.jianshu.io/upload_images/599584-58d31e5b80737ca0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 详细了解了这个过程之后,我们就可以对执行上下文总结一些结论了。 * 单线程 * 同步执行,只有栈顶的上下文处于执行中,其他上下文需要等待 * 全局上下文只有唯一的一个,它在浏览器关闭时出栈 * 函数的执行上下文的个数没有限制 * 每次某个函数被调用,就会有个新的执行上下文为其创建,即使是调用的自身函数,也是如此。 ## 执行上下文的生命周期 当调用一个函数时(激活),一个新的执行上下文就会被创建。而一个执行上下文的生命周期可以分为两个阶段。 * 创建阶段 在这个阶段中,执行上下文会分别创建变量对象,建立作用域链,以及确定this的指向 * 代码执行阶段 创建完成之后,就会开始执行代码,这个时候,会完成变量赋值,函数引用,以及执行其他代码。 ![](https://box.kancloud.cn/d226cbb545d555ee19b5c2ef608064ff_1000x290.png) # 参考资料 * [JS执行上下文(执行环境)详细图解](https://www.cnblogs.com/lsgxeva/p/7976026.html)