~/VibeHandbook
免費 PDF

程式語言

typescriptlang.org

TypeScript

是什麼

想像一個拼寫檢查器:你打字時它會給拼錯的詞畫上下劃線,讓你在按下發送之前就發現錯誤。TypeScript 對你的程式碼做的正是這件事。它是在 JavaScript 之上疊加了一套靜態型別系統的語言——這套系統會在你寫程式碼的同時按規則檢查,及早指出錯誤。它會編譯成普通的 JavaScript,因此凡是 JS 能執行的地方它都能執行——瀏覽器、Node、Deno、Bun、邊緣執行時——同時在程式碼執行之前就捕獲一整類 bug。

優勢

  • 靜態型別在編譯期捕獲拼寫錯誤、null 失誤和形狀不匹配。
  • 出色的編輯器體驗:自動補全、內聯文件、安全重構。
  • 漸進式採用——你想標註多少型別就標註多少。
  • 前後端使用同一種語言,並擁有龐大的 npm(Node 包管理器)生態。

權衡取捨

  • 需要一個構建/編譯步驟,以及一個待配置的 tsconfig.json
  • 型別系統強大到足以變得相當複雜(泛型、條件型別),可能成為時間黑洞。
  • 型別檢查只在你編寫和構建程式碼時發生。程式真正執行起來後,這些檢查就不在了,因此對於不可信的輸入你仍需做執行時校驗(在程式執行時對真實資料再做一次檢查,例如 Zod)。
  • 在各種打包器和執行時之間,配置和工具鏈頻繁變動。

何時選用

任何非平凡的 JavaScript 專案都該選用 TypeScript,尤其是有多名貢獻者或生命週期較長的專案。它是現代 Web 應用(React、Next.js、SvelteKit)、Node/邊緣後端,以及任何重視重構安全性的專案的預設之選。

與 vibe coding 的契合度

AI 助手在 TypeScript 中如魚得水,因為型別檢查器給了它們——也給了你——一個快速的反饋迴路:把編譯錯誤貼上回去,模型通常能幹淨地修復它。指揮 AI 時,要求精確的型別而非 any,並在信任邊界((應用程式介面)輸入、環境變數(env var))處要求做執行時校驗。明確告訴它你的執行時和框架版本,好讓生成的 import 和配置相匹配。當型別變得棘手時,要求模型解釋推斷出的型別,而不是盲目地將其放寬。

type User = { id: number; name: string; email?: string };

function greet(user: User): string {
  return `Hi ${user.name}` + (user.email ? ` <${user.email}>` : "");
}

console.log(greet({ id: 1, name: "Ada" }));