讀別人的程式碼

理解任何程式碼庫的系統做法

⏱ 預估 ~8 分鐘

01 · 讀一讀

驚訝大部分新手的秘密：專業工程師讀程式碼的時間比寫多。

你加入團隊、切專案、甚至幾週後回到自己程式碼，你都要懂沒寫過的（或不記得寫的）程式碼。亂捲、希望搞懂沒用。你需要系統。

好消息？讀程式碼是技能，跟任何技能一樣練越多越容易。我們學一個任何程式碼庫都能用的可重複流程。

💡 想像一下讀新程式碼庫像探索新城市。你不會從亂走街開始。先看地圖（README）、看附近有什麼（相依套件）、找主幹道（入口點）、再一個一個探索鄰里（模組）。

你剛拿到別人的專案 — Task API。沒看過這程式碼。我們在終端機一步步套用程式碼閱讀協議。

程式碼閱讀協議步驟 1:讀 README。README 告訴你專案做什麼、怎麼裝、怎麼跑。永遠先看這。

(本節為互動練習，請啟用 JavaScript 體驗)

步驟 2:看 package.json。相依套件告訴你用什麼技術。Scripts 告訴你怎麼跑跟測試。

(本節為互動練習，請啟用 JavaScript 體驗)

步驟 3:找入口點跟掃結構。你從 package.json 知道 app.js 是入口點。先看資料夾結構，再讀主檔。

(本節為互動練習，請啟用 JavaScript 體驗)

程式碼閱讀協議 — 任何新程式碼庫都照這些步驟

README.md 告訴你專案做什麼、怎麼裝、怎麼跑。永遠先看這。沒 README 也告訴你一些 — 專案可能文件不好。

相依套件告訴你用什麼技術。Scripts 告訴你怎麼跑跟測試。看 "dependencies" 看主要函式庫、"scripts" 看像 "start"、"test"、"build" 的指令。

程式碼怎麼組織？看 src/、public/、routes/、models/ — 這些暗示架構。所有東西在一個資料夾的平結構表示小專案。有清楚名字巢狀資料夾表示好組織的。

通常 index.js、app.js、或 main.js — 程式從這開始。在 package.json 的 "main" 欄位或 "start" script 會指你看。

從入口點，追 require() 或 import 陳述了解相依樹。每個 import 帶你到下一塊拼圖。不要試著一次懂所有 — 先 map 連線。

用 Claude Code：「給我這專案概覽」立刻拿到高層總結。Claude 能讀每個檔、幾秒給你程式碼庫地圖 — 你手動可能要花幾小時。

探索新專案時，第一個讀的檔是 _____。

探索新程式碼庫時，該先讀什麼？

⚠ 完整互動體驗需要 JavaScript。請啟用 JavaScript 後重新整理。

※ 本站為獨立繁中教學專案，非 Anthropic 官方產品。Claude™ 為 Anthropic, PBC 商標。