调用栈是JS管理同步函数执行的核心机制，遵循后进先出原则：全局上下文最先入栈，函数调用时新建执行上下文压栈并立即执行，返回时自动弹栈；异步任务不入栈，无限递归会导致栈溢出。

JavaScript 是单线程语言，同步代码的执行完全依赖调用栈（Call Stack）来管理函数的执行顺序：先入后出，压栈即开始执行，弹栈即执行完成。

调用栈如何工作

每当一个函数被调用，JS 引擎会将该函数的执行上下文（Execution Context）推入调用栈顶部；函数执行完毕后，该上下文自动从栈顶移除。这个过程是严格同步、不可中断的。

• 全局代码执行时，会先创建并压入一个 全局执行上下文
• 每次函数调用都生成新的执行上下文，压入栈顶，成为当前正在执行的上下文
• 函数返回（包括隐式 return undefined）或抛出未捕获错误时，当前上下文立即弹出

一个直观的例子

看这段同步代码：

function foo() { console.log('foo'); }
function bar() { foo(); console.log('bar'); }
bar();

执行过程如下：

deep-java-review

Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...

下载

立即学习“Java免费学习笔记（深入）”；

• 全局上下文入栈 → 执行 bar() → bar 上下文入栈
• bar 内调用 foo() → foo 上下文入栈
• foo 执行完 → foo 上下文弹栈
• bar 继续执行后续语句 → bar 执行完 → bar 上下文弹栈
• 回到全局上下文 → 全局执行结束 → 栈清空

常见误解与注意点

调用栈只跟踪同步函数调用，它不包含异步任务（如 setTimeout、Promise.then、事件回调），这些由 Web API 和任务队列管理，不会出现在栈中。

• 报错时浏览器控制台显示的 “at …” 调用路径，就是当前时刻的调用栈快照
• 无限递归会导致“Maximum call stack size exceeded”错误——栈空间被耗尽
• 使用 debugger 或断点时，可在开发者工具中实时查看调用栈状态

为什么理解压栈弹栈很重要

它是理解 JS 执行模型的基础，直接影响对作用域、闭包、this 绑定、错误堆栈、以及调试逻辑的理解。

• 每个执行上下文都携带自己的变量环境和词法环境，栈结构决定了它们的生命周期
• 函数嵌套越深，栈帧越多，内存占用越高（虽通常可忽略，但递归场景需警惕）
• 错误堆栈信息的顺序，正反映了压栈的历史路径，是定位问题的关键线索