在 TypeScript 中，字面量類型（Literal Types）是一種特殊的類型，它允許你將變量的類型限制為某個具體的值（如特定的字符串、數字或布爾值），而不僅僅是寬泛的類型（如?string、number）。字面量類型通常與聯合類型（Union Types）結合使用，用于創建更精確的類型約束。
一、字面量類型的三種形式
1.?字符串字面量類型
將變量的類型限制為特定字符串值：
let direction: "up" | "down" | "left" | "right";
direction = "up"; // ? 合法
direction = "north"; // ? 錯誤：不能將類型 'north' 分配給類型 '"up" | "down" | "left" | "right"'
2.?數字字面量類型
將變量的類型限制為特定數值：
let httpStatusCode: 200 | 404 | 500;
httpStatusCode = 200; // ? 合法
httpStatusCode = 403; // ? 錯誤：不能將類型 '403' 分配給類型 '200 | 404 | 500'
3.?布爾字面量類型
將變量的類型限制為?true?或?false（實際用途較少，因為直接使用?boolean?更常見）：
let isDone: true;
isDone = true; // ? 合法
isDone = false; // ? 錯誤：不能將類型 'false' 分配給類型 'true'
二、字面量類型的應用場景
1.?函數參數的精確類型約束
function setAlignment(align: "left" | "center" | "right") {// ...
}setAlignment("center"); // ? 合法
setAlignment("justify"); // ? 錯誤
2.?狀態機或配置對象
type ButtonState = "enabled" | "disabled" | "loading";const button: { state: ButtonState } = {state: "enabled" // 只能是三種狀態之一
};
3.?類型守衛與條件類型
結合類型守衛，根據字面量類型執行不同邏輯：
type Shape = | { kind: "circle"; radius: number }| { kind: "square"; sideLength: number };function getArea(shape: Shape) {if (shape.kind === "circle") {return Math.PI * shape.radius ** 2; // TypeScript 知道 shape 是圓形}// 無需 else 分支，TypeScript 自動推導 shape 是方形return shape.sideLength ** 2;
}
三、字面量類型與聯合類型的結合
字面量類型的強大之處在于與聯合類型結合，創建更靈活的類型系統：
type ResponseFormat = "json" | "xml" | { custom: string };function fetchData(format: ResponseFormat) {if (typeof format === "string") {// format 是 "json" 或 "xml"} else {// format 是 { custom: string }}
}
四、字面量類型的推斷與縮小
1.?類型推斷
// 推斷為 "hello"（字符串字面量類型）
const greeting = "hello";// 推斷為 string（因為變量可重新賦值）
let message = "hello";
message = "world"; // 合法
2.?類型縮小（Type Narrowing）
通過條件判斷將寬泛類型縮小為字面量類型：
function printID(id: number | string) {if (typeof id === "string") {console.log(id.toUpperCase()); // id 被縮小為 string 類型} else {console.log(id.toFixed(2)); // id 被縮小為 number 類型}
}
五、字面量類型的進階用法
1.?模板字面量類型（Template Literal Types）
基于字符串字面量組合出新的類型：
type Color = "red" | "blue";
type Size = "small" | "large";
type ProductID = `${Color}-${Size}`; // "red-small" | "red-large" | "blue-small" | "blue-large"
2.?字面量類型與枚舉（Enum）的對比
- 枚舉：編譯后存在于運行時，可被修改。
- 字面量類型：僅存在于類型系統，編譯后消失，更輕量。
// 枚舉
enum Direction { Up, Down, Left, Right }
const d: Direction = Direction.Up;// 字面量類型
type DirectionLiteral = "up" | "down" | "left" | "right";
const dl: DirectionLiteral = "up";
總結：字面量類型的核心價值
- 精確性：將變量類型約束到具體值，增強類型安全性。
- 可讀性：代碼中明確聲明允許的值，減少歧義。
- 與其他特性結合：聯合類型、條件類型、模板字面量類型等，構建復雜類型系統。
)
