iT邦幫忙

鐵人檔案

2026 iThome 鐵人賽
回列表
JavaScript

從 JavaScript 到 TypeScript:30 天建立 AI 時代的型別思維 系列

AI 現在可以快速產生程式碼,但要怎麼和它協作,才能降低出錯的機會?

這個系列會從 JavaScript 出發,一步步認識 TypeScript,含型別推論、聯合型別、泛型,以及如何用型別描述資料與規則。

除了理解 TypeScript 能提早發現哪些問題,也會認識程式執行後才可能出現的錯誤。

最後再延伸到 AI 開發,學習怎麼檢查 AI 回傳的資料,讓 TypeScript 成為我們和 AI 協作時的一道把關。

參賽天數 25 天 | 共 25 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 11

day11|型別縮小:讓條件判斷幫忙確認型別

前一篇用聯集列出題型允許的值。當一個變數有多種可能時,使用它的程式還得確認目前拿到哪一種。假設作答資料可能是一段文字,也可能是一組選項。 型別縮小(narrow...

2026-09-24 ‧ 由 johnson3669 分享
DAY 12

day12|可辨識聯集:一個欄位決定要帶哪些資料

上一篇練習用條件判斷縮小型別,讓程式知道目前是哪一種可能。這次來看怎麼把資料寫清楚,讓每種狀態都對得上該有的欄位。 題目請求可能正在載入、已取得題目,或載入失敗...

2026-09-25 ‧ 由 johnson3669 分享
DAY 13

day13|any、unknown、never:處理未知資料與遺漏分支

前一篇把題目請求分成幾種狀態,讓 TypeScript 知道每個狀態有哪些資料。資料剛從外部進來時,我們可能連它是不是題目都還不知道。 any:忽略這個值的型別...

2026-09-26 ‧ 由 johnson3669 分享
DAY 14

day14|型別斷言:as 為什麼可能只是在欺騙自己?

前一篇用 unknown 保留尚未確認的資料。as 是 TypeScript 的型別斷言(type assertion)語法,可以請編譯器把值當成指定型別。 t...

2026-09-27 ‧ 由 johnson3669 分享
DAY 15

day15|Interface vs Type:從使用目的判斷

前面幾篇用 type 描述題目與狀態。今天這篇加入 interface,先比較它和 type 如何描述同一份題目資料: interface QuestionIn...

2026-09-28 ‧ 由 johnson3669 分享
DAY 16

day16|結構型別:長得一樣就可能相容

前一篇比較了 interface 和 type。這篇接著看 TypeScript 怎麼判斷資料能不能交給某段程式使用,這種判斷叫型別相容性。型別名稱不同,資料仍...

2026-09-29 ‧ 由 johnson3669 分享
DAY 17

day17|函式型別:函式也是資料契約

前一篇用物件的欄位判斷兩份資料能不能互相使用。函式也能被存進變數、當成參數傳遞,因此同樣需要一份契約:呼叫端會提供哪些資料,函式完成後又會交回什麼結果。 這篇會...

2026-09-30 ‧ 由 johnson3669 分享
DAY 18

day18|泛型:保留輸入與輸出的關係

前一篇用多載描述幾種固定的呼叫方式。泛型讓同一份函式或型別定義適用於各種型別,使用時再決定具體型別。 聯集沒有保留輸入與輸出的對應 假設取出陣列第一筆資料的函式...

2026-10-01 ‧ 由 johnson3669 分享
DAY 19

day19|keyof、typeof 與索引存取型別:避免重複維護型別

前一篇用泛型保留不同位置的型別關係。這次介紹如何從既有的值或型別取得資訊,讓鍵名與欄位型別跟著來源更新。 例如題型標籤已經寫在物件裡,卻又另外宣告一份題型聯集:...

2026-10-02 ‧ 由 johnson3669 分享
DAY 20

day20|工具型別:從既有型別產生新型別

前一篇介紹如何取得既有型別的鍵名與欄位型別。有時候我們還需要保留部分欄位,或把必填欄位改成選填。TypeScript 內建的工具型別(utility types...

2026-10-03 ‧ 由 johnson3669 分享