设置断点
暂停执行并检查状态。
设置断点 是 CoddyKit 上的免费 JavaScript Academy 课时。 这是第 2 节课，共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 JavaScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 4 节课。
什么是断点
断点会告诉调试器在指定行暂停执行。暂停期间，您可以检查变量和调用栈，以了解程序的状态。
为什么断点优于日志记录
与分散添加日志语句相比，断点可以让您在不修改代码的情况下，检查某个时刻作用域中的每个变量，并从那里继续执行或单步执行。
打开源代码面板
在浏览器 DevTools 中，断点位于源代码面板。打开 DevTools，切换到源代码面板，然后在文件树中找到您的脚本文件。
设置行断点
点击语句旁边的行号栏，即可在那里设置断点。设置后会出现标记，并且当该行即将执行时，程序会暂停。
调试语句
在代码中添加调试语句后，只要 DevTools 已打开，程序就会以编程方式触发断点。在发布生产代码之前应将其移除。
function compute(x) {
const doubled = x * 2
// a debugger statement on the next line would pause execution here
return doubled + 1
}条件断点
右键点击某一行即可添加条件。只有当表达式为真时，调试器才会暂停；在循环中，这一点尤其有用。
日志点
日志点会打印消息但不会暂停，就像通过 DevTools 临时添加日志语句，而不必编辑源代码。
检查变量
暂停时，作用域窗格会列出局部变量、闭包变量和全局变量及其当前值，因此您可以验证自己的判断。
监视表达式
监视窗格会在每次暂停时计算您定义的表达式，让您在单步执行代码时监控计算出的值。
在事件处设置断点
DevTools 还可以在事件处暂停，例如点击事件或网络请求，让程序在事件触发的瞬间暂停执行。
管理断点
断点窗格会列出所有断点。您可以使用复选框暂时禁用断点，也可以在调试完成后将其移除。
快速检查
测试您对断点的了解。
回顾
回顾：断点会暂停执行，以便进行检查。
- 在源代码面板的行号栏中设置断点
- 调试语句可以通过编程方式暂停程序
- 条件断点仅在条件为真时暂停
- 暂停时检查作用域并监视表达式
常见问题解答
「设置断点」课时是免费的吗？
是的 — 「设置断点」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 JavaScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 4 节课。
「设置断点」这节课中我会学到什么？
暂停执行并检查状态。 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 JavaScript Academy 需要有经验吗？
无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 2 节课，共 4 节。
「设置断点」课时需要多长时间？
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。
我能在这节 JavaScript Academy 课中编写并运行代码吗？
能。每节 JavaScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。