温故而知新 - 重新认识JavaScript的Execution Context

JavaScript的Execution Context

在程序开发过程中，开发者需要分清程序的执行阶段，每个阶段会有不同的执行域，每个执行域又分别有它独有的行为和特点。这样才能根据不同的执行阶段和不同的执行域，使用合适的方法和技巧去处理遇到的问题，提高开发效率。从表面上看，JavaScript的执行环境是一个很简单的单线程，但是由于执行域的存在，使得JavaScript的执行过程就变得有趣而复杂。本篇文章将从宏观和微观的视角去了解JavaScript的Execution Context，学习一个可复用的JS迷你虚拟机设计案例。

更新下相关知识，立足过往，拥抱未来。ExecutionContext为抽象概念，用来可执行代码的执行环境。可执行代码的运行，都是在ExecutionContext中。ExecutionContext Stack为后进先出（LIFO）的栈结构。栈顶永远是running context。什么是ExecutionContext Stack呢？ExecutionContext Stack就是用于存储执行上下文的栈，按照LIFO原则工作。

程序中可同时存在多个执行上下文，他们可以同时存在，并且可以是嵌套的。比如全局执行上下文套用着函数执行上下文，函数执行上下文套用了另一个函数执行上下文。然后通过改变栈顶位置来切换执行上下文。

如果每个函数拥有独立的Execution Context，那么当遇到一个函数嵌套一个函数这样的情况，是否意味着需要先执行完外层的函数，才能执行内层的函数呢？其实不然。JavaScript解释器是单线程的，这意味着它一次只能执行一个任务。因此，当一个函数被调用时，JavaScript解释器会创建一个新的执行上下文，并将它压入执行上下文栈。然后，解释器会暂停执行当前的执行上下文，并开始执行新创建的执行上下文。当新创建的执行上下文执行完毕后，它会被弹出执行上下文栈，然后解释器会继续执行先前暂停的执行上下文。

说了这么多，那么该怎么理解JS的执行上下文呢？我们可以通过一个简单的例子来理解：

// 全局执行上下文
var a = 1;

// 函数执行上下文
function foo() {
  var b = 2;
}

// 函数执行上下文
foo();

在这个例子中，全局执行上下文是整个程序的执行环境，它包含了所有全局变量和函数。函数执行上下文是foo()函数的执行环境，它包含了foo()函数的所有局部变量和参数。当foo()函数被调用时，JavaScript解释器会创建一个新的执行上下文，并将它压入执行上下文栈。然后，解释器会暂停执行全局执行上下文，并开始执行foo()函数的执行上下文。当foo()函数执行完毕后，它会被弹出执行上下文栈，然后解释器会继续执行全局执行上下文。

希望通过阅读本文，您可以对JavaScript的Execution Context有一个更深入的了解。这将有助于您编写出更健壮和可维护的JavaScript代码。