调试
调试就是找出程序为什么做错。这一页有一份订单 { drink: "tea", size: "regular" }，以及一个错误的属性名。bug 读取 order.cup。损坏的日志是 tea / undefined。修好之后，页面那一行是 fixed / tea / regular。
这不是类的那一课
上一页建立了 Drink 和 SpecialDrink。它的一行是 tea / regular / mint。那里没有故意弄坏的地方。
这里的数据从一开始就是对的。bug 读取 order.cup，对象里有的是 size，不是 cup。真正的属性是 size。
先读值，再改函数
console.log 打印一个值，并且不会让脚本停下来。console.warn 标出警告。console.error 标出失败。它们都不修理数据，只是让错误的值看得见。
属性名错了
label 把 order.drink 和 order.cup 接在一起。drink 存在，所以第一个词是 tea。cup 不存在，所以第二个词是 undefined。
const order = { drink: "tea", size: "regular" };
function label(order) {
return order.drink + " / " + order.cup;
}
console.log(label(order));
日志是 tea / undefined。对象里仍然有 size。函数从来没有读过它。
标出失败
当 size 缺失时，调用 console.error("missing size")。这段代码传入一份没有尺寸的订单，让错误路径运行。console.error("missing size") 不会抛出。
function label(order) {
if (!order.size) {
console.error("missing size");
return order.drink + " / missing size";
}
return order.drink + " / " + order.size;
}
console.log(label({ drink: "tea" }));
控制台显示错误 missing size，返回的文本是 tea / missing size。缺少 size 的空订单返回 tea / missing size。空字符串也算缺失，因为 !"" 为真。
有意暂停
debugger 语句要求浏览器仅在开发者工具打开时暂停。工具关闭时，这条语句什么也不做，下一行仍然运行。
const order = { drink: "tea", size: "regular" };
debugger;
console.log(order.size);
工具打开时，执行停在 debugger，你可以查看 order。工具关闭时，下一条日志是 regular。debugger 不是错误，也不会改动 order。
调用列表
如果 label 调用 format，而 format 抛出，控制台会列出两个函数名。从列表顶端开始：那就是失败的那一行。然后再回到调用者。这一页的 bug 什么也不抛出。undefined 是一个值，所以在你自己记录之前，列表保持安静。
只改一个名字
把 order.cup 换成 order.size。不要为了消除 undefined 就给对象加上 cup。对象本来就是对的。真正的属性是 size。
修好之后的那一行
页面读取 size，检查它，并在标签前面写一个简短状态。
<!DOCTYPE html>
<html>
<body>
<p id="line">…</p>
<script>
const order = { drink: "tea", size: "regular" };
function label(order) {
if (!order.size) {
console.error("missing size");
return order.drink + " / missing size";
}
return order.drink + " / " + order.size;
}
document.getElementById("line").textContent = "fixed / " + label(order);
</script>
</body>
</html>
这一行读作 fixed / tea / regular。fixed 这个词只是状态。饮品和尺寸来自对象。tea / undefined 是损坏函数的结果。
在柜台
- 在它读取
order.cup时记录label(order)。日志是 tea / undefined。 - 传入
{ drink: "tea" }并阅读错误。返回的文本是 tea / missing size。 - 把
debugger留在脚本里。工具关闭时，下一条日志仍然是 regular。 - 阅读页面那一行：fixed / tea / regular。
常见错误
- 因为日志显示 undefined 就去改对象
- 把
console.log当成暂停；console.log不会让脚本停下来 - 以为开发者工具关闭时
debugger也会让页面停下 - 从类那一页去读
tea / regular / mint - 调用
console.error("missing size")却以为它会抛出
记住这些
console.log显示一个值，脚本继续运行- 读错的是
order.cup；真正的属性是size console.error("missing size")标出失败，并且不会抛出debugger只在开发者工具打开时暂停- 页面那一行是 fixed / tea / regular
🧠 测试您的知识
测试您的知识
通过这个互动测验挑战自己，看看你对这个主题的理解程度如何
📝 说明
- 仔细阅读每个问题
- 为每个问题选择最佳答案
- 您可以随时重新参加测验
- 您的进度将显示在顶部