什么是 JavaScript 中的调用堆栈？

介绍

在计算机科学中，调用堆栈（又称执行堆栈、控制堆栈、运行时堆栈、机器堆栈等）是用于跟踪程序执行的一种重要数据结构。当程序执行函数调用时，调用堆栈记录了每个函数调用的位置、状态和变量等信息。当函数执行完毕后，调用堆栈会返回到之前的函数调用位置，并继续执行之前未完成的代码。

JavaScript 中的调用堆栈

JavaScript 也有自己的调用堆栈。当 JavaScript 执行函数调用时，会将调用信息保存在调用堆栈中。当函数执行完毕后，会从调用堆栈中弹出该函数信息，并返回到之前的函数调用位置。在 JavaScript 中，调用堆栈被称为“执行上下文栈”。

JavaScript 执行上下文

在 JavaScript 中，每个函数调用都会创建一个执行上下文。执行上下文是一个包含程序执行期间所有变量、函数和参数等信息的对象。执行上下文包括：

• 变量环境：包含函数内部定义的变量和函数
• 词法环境：包含函数内部和外部作用域链
• this 关键字的值：包含当前函数的 this 关键字所引用的对象。

JavaScript 执行上下文栈

JavaScript 执行上下文栈记录了整个程序执行的状态。在 JavaScript 中，每当一个函数被执行，它就会创建一个新的执行上下文，并被压入调用栈中。当函数返回时，JavaScript 引擎会从执行上下文栈中弹出该函数的执行上下文，并继续执行之前未完成的代码。因此，执行上下文栈的顺序决定了函数调用顺序。

示例

下面是一个简单的 JavaScript 代码示例，说明了调用堆栈的工作原理：

function a() {
    b();
}

function b() {
    c();
}

function c() {
    console.log('Hello World!');
}

a();

在上面的代码中，函数 a 调用函数 b，函数 b 又调用函数 c。当执行函数 a 时，会将 a 函数的执行上下文压入执行上下文栈（调用堆栈）中，并开始执行 a 函数。在执行 a 函数时，a 函数又调用了函数 b，并将 b 函数的执行上下文压入执行上下文栈中。在执行 b 函数时，b 函数又调用了函数 c，并将 c 函数的执行上下文压入执行上下文栈中。在执行函数 c 时，c 函数会输出 "Hello World!" 并返回到函数 b。在函数 b 中，b 函数会继续执行并返回到函数 a。当函数 a 执行完毕后，JavaScript 引擎会从执行上下文栈中弹出函数 a 的执行上下文，并返回到之前的调用位置。

总结

调用堆栈是 JavaScript 中一个重要的概念，用于跟踪函数调用和执行顺序。通过了解调用堆栈的工作原理，我们可以更好地理解 JavaScript 函数和程序执行的过程。