写代码免不了要调试，尤其是在程序跑出意料之外的结果时。很多人一上来就加 断点，但其实还有个更轻量的方式——变量监视。这两者看起来都是为了看清程序运行时发生了什么，但用法和场景完全不同。
断点：让程序暂停下来
断点的作用是让程序运行到某一行时停下来。比如你在某个函数里怀疑逻辑有问题，就在那行打个断点。程序执行到这里就会冻结，你可以一步步往下走，看看每一步的执行流程。
举个生活中的例子：就像你看一部电影，看到某个情节觉得不对劲，就按下暂停键，逐帧播放，观察人物动作有没有异常。断点就是这个“暂停键”。
在大多数开发工具里，比如 VS Code 或 Chrome DevTools，你只要点击行号旁边就能设置断点：
function calculatePrice(quantity, price) {
let total = quantity * price;
if (total > 100) {
total -= 10; // 在这行设断点
}
return total;
}变量监视：只盯住你想看的值
变量监视不一样，它不需要暂停程序。你只是告诉调试器：“我想随时知道这个变量现在是多少”。它就像一个监控摄像头，一直盯着某个变量的变化，但不会干扰程序正常运行。
比如你在循环里处理一批数据，想看看 sum 每次累加后变成多少，就可以把 sum 加入监视列表。每次循环更新，你都能在面板里看到最新值，不用中断流程。
let sum = 0;
for (let i = 0; i < items.length; i++) {
sum += items[i].value; // 监视 sum 的变化
}什么时候用哪个？
如果你的问题是“为什么没进这个 if 分支”，那就用断点。停在那行，检查条件是否成立，一步步走，看流程是不是按你想的来。
但如果你只是想知道“这个变量到底变没变”，比如接口返回的数据有没有正确赋值给 user.name，那就加个变量监视，刷新页面，直接看值就行，不用打断整个流程。
再打个比方：断点像是把车停下来检查发动机，而变量监视就像是开着车看仪表盘上的油量表。一个重排查，一个重观察。
很多新手一遇到问题就狂设断点，结果程序走一步停一下，反而把自己绕晕了。其实先试试变量监视，可能几秒就发现问题所在。