Debug 心態
找跟修 bug 的科學做法
⏱ 預估 ~8 分鐘
01 · 讀一讀
你程式碼會壞。每個工程師程式碼都會壞。新手跟專業差別不是專業寫沒 bug 程式碼 — 是專業知道怎麼系統化找跟修 bug。
Debug 不是隨機試錯。不是改東西寄望最好。是科學方法：觀察、假設、測試、結論。
看起來像 debug 巫師的工程師不是比較聰明 — 他們只是照流程而不是慌張。
💡 想像一下Debug 像當偵探。罪（bug）發生。你蒐證（錯誤訊息、log）、形成理論（假設）、測試（改一件事）、要嘛破案、要嘛形成新理論。你從不隨機抓人寄望最好。
02 · 步驟說明
Debug 流程 — 每次遇到 bug 照這些步驟
1. REPRODUCE(重現)
你能讓 bug 一致發生嗎？如果隨機，看時間或狀態問題。不能重現就不能有信心修。寫下觸發 bug 的確切步驟。
2. ISOLATE(隔離)
確切哪裡出錯？縮到特定檔、函式、行。用 console.log 或錯誤訊息指出位置。你調查區域越小，找問題越快。
3. HYPOTHESIZE(假設)
你覺得什麼造成？改任何東西前形成理論。「我覺得 bug 是因為我們存取 index 0 時陣列是空的。」有理論讓你調查專注。
4. TEST(測試)
改一件事測試你假設。永遠不要一次改多件 — 改三件 bug 沒了，你不知道哪個修的。這裡紀律之後省你幾小時。
5. FIX(修)
根據學到的套用修法。好修法處理根本原因，不只症狀。陣列空時使用者當機，不要只藏錯誤 — 正確處理空陣列。
6. VERIFY(驗證)
原 bug 還會發生嗎？你弄壞別的嗎？測修法、然後測週邊。製造新 bug 的修法不算真的修。
03 · 讀一讀
我們把流程套用實踐。你繼承一個有 bug 的 app — 訪客計數 API。它在使用者打 /api/stats endpoint 時當機。你工作：照 debug 流程找 bug。
04 · 終端機練習
步驟 1:REPRODUCE — 讀錯誤 log 懂哪裡錯。錯誤訊息是你最好的朋友。它們通常確切告訴你發生什麼、在哪。
(本節為互動練習，請啟用 JavaScript 體驗)
05 · 終端機練習
步驟 2:ISOLATE — 錯誤指 count 在第 7 行 undefined。那值來自 getVisitorCount()。讀程式碼找函式看哪裡錯。
(本節為互動練習，請啟用 JavaScript 體驗)
06 · 讀一讀
下面是會省你無數小時的 debug 黃金規則。需要的話貼在你螢幕上。
重點整理
- 不要一次改多件 — 你不知道什麼修了
- 讀錯誤訊息 — 通常告訴你哪裡錯跟在哪
- 信錯誤，不要信你對 bug 在哪的假設
- 每個工程師都 debug。資深工程師只是更系統化做。
07 · 填空
Debug 第一步是一致地 _____ bug。
08 · 選擇題
Debug 的第一步是什麼？
- 一致地重現 bug
- 改程式寄望最好
- 請 Claude 修
- 刪檔重來
⚠ 完整互動體驗需要 JavaScript。請啟用 JavaScript 後重新整理。
※ 本站為獨立繁中教學專案，非 Anthropic 官方產品。Claude™ 為 Anthropic, PBC 商標。