TypeScript：為什麼要加型別？

JavaScript 的問題

function add(a, b) {
    return a + b;
}

add(1, 2);       // 3 ✅
add('1', 2);     // '12' ← 字串串接！不是你想要的
add(null, 2);    // 2 ← 沒有報錯，但邏輯可能有問題
add({}, []);     // '[object Object]' ← WTF

// 你呼叫一個 API 回傳的物件
const user = await getUser(1);
user.nmae; // typo！但 JS 不會報錯，只會回傳 undefined
// 直到上線後使用者反映「名字沒顯示」你才發現

TypeScript 怎麼解決？

function add(a: number, b: number): number {
    return a + b;
}

add(1, 2);     // ✅
add('1', 2);   // ❌ 編譯時就報錯：Argument of type 'string' is not assignable

interface User {
    id: number;
    name: string;
    email: string;
}

const user: User = await getUser(1);
user.nmae; // ❌ 編譯時報錯：Property 'nmae' does not exist. Did you mean 'name'?

常見反對意見

"寫 TypeScript 太慢了，要多寫很多型別"
→ IDE 自動推斷大部分型別，不需要全部手寫
→ 前期慢 10%，debug 省 50%

"小專案不需要"
→ 確實，個人小工具用 JS 就好
→ 但超過 2 人的團隊、或活超過 3 個月的專案，TS 回本很快

"any 就好了"
→ any 等於沒有 TypeScript，那你用 JS 就好了
→ unknown 比 any 安全（強制你做型別檢查後才能使用）

什麼時候用 TS / 什麼時候用 JS？

TypeScript 不是銀彈，但在 2024 年，新的前端專案「預設用 TypeScript」已經是業界共識。