掌握单步执行调试技巧，快速定位代码问题

什么是单步执行调试

写代码时遇到程序跑不起来、结果不对或者突然崩溃，光靠眼睛看很难找出问题。这时候，单步执行就成了最直接的“放大镜”。它允许你一行一行地运行代码，观察每一步变量的变化和程序走向，就像慢动作回放一样。

比如你在做一个简单的计算器功能，输入 5 减 3，结果却显示 8。你怀疑是加减符号搞混了，但翻了几遍代码也没发现错在哪。开启单步调试后，走到计算那一步，你会发现原来是传参时把操作符颠倒了。

如何使用单步执行

大多数现代开发工具都支持单步调试，比如 VS Code、IntelliJ IDEA、Chrome DevTools。基本操作包括“步入”（Step Into）、“跳过”（Step Over）和“跳出”（Step Out）。

假设你有一段 JavaScript 函数：

function calculate(a, b) {
    let sum = a + b;
    let result = multiply(sum, 2);
    return result;
}

function multiply(x, y) {
    return x * y;
}

你在 calculate(4, 6) 这行打了断点，按下“跳过”，它会把 sum = a + b 执行完，不会进入 multiply 内部。如果你按“步入”，就会进入 multiply 函数内部，继续查看乘法是否正确执行。

巧用断点配合单步执行

断点是单步调试的起点。与其从头开始一步步走，不如先在可疑区域设断点。比如处理用户登录时，token 总是为空。你可以在获取 token 的那行设置断点，然后单步往下走，看看是在解析阶段出错，还是存储时丢失。

有时候循环里出问题，可以右键断点设置条件，比如只在第 10 次循环时中断。这样避免手动“跳过”前 9 次，节省时间。

观察变量状态变化

单步执行最大的优势是能实时看到变量值。在调试界面通常有“Variables”面板，展示当前作用域内的所有变量。你也可以鼠标悬停在变量名上查看当前值。

举个例子，你在遍历数组处理数据，发现某个元素处理结果异常。单步走到那一次循环，立刻就能看到输入值、中间计算值和最终输出，对比预期就能快速锁定逻辑漏洞。

避开常见陷阱

有些人习惯狂打日志代替调试，结果控制台刷屏反而更难找信息。单步执行更精准，还能随时暂停和回看。但也别盲目逐行走下去，尤其是进入第三方库代码，容易迷失方向。遇到不熟悉的函数，先“跳过”观察结果，有问题再“步入”深挖。

异步代码更要小心。比如 setTimeout 或 Promise，单步执行时如果没注意，可能就直接跳过了回调部分。建议在回调函数内也设断点，确保能跟进去。