什么是 JavaScript 中的调用堆栈？

JavaScript 使用调用堆栈来跟踪多个函数调用。它就像数据结构中的真实堆栈，可以在其中推送和弹出数据，并遵循后进先出 (LIFO) 原则。我们使用调用堆栈来记住当前正在运行的函数。下面的示例演示了调用堆栈。

例子：

Javascript

function f1() {
  console.log('Hi by f1!');
}
  
function f2() {
  f1();
  console.log('Hi by f2!');
}
  
f2();

输出：

"Hi by f1!"
"Hi by f2!"

解释：

下面的步骤和插图解释了上述函数的调用堆栈。

第 1 步：当代码加载到内存中时，全局执行上下文被压入堆栈。

第 2 步：调用f2()函数，并将f2()的执行上下文压入堆栈。

第 3 步： f2()开始执行，在执行期间， f1()函数在f2()函数内部被调用。这会导致f1()的执行上下文被推入调用堆栈。

第 4 步：现在f1()函数开始执行。 console.log()方法的新堆栈帧将被推送到堆栈中。

第 5 步：当console.log()方法运行时，它将打印“Hi by f1”，然后从堆栈中弹出。执行上下文将返回到函数，现在f1()函数中没有任何代码行，因此，它也将从调用堆栈中弹出。

第 6 步： console.log()方法同样会发生这种情况，该方法打印“Hi by f2”行，然后函数f2()将完成并被推离堆栈。