第8章：类型系统进阶

字面量类型与枚举（enum）

1. 字面量类型（Literal Types）

字面量类型是 TypeScript 中一种特殊的类型，它将值直接作为类型使用。
主要形式：

  • 字符串字面量类型：type Direction = "left" | "right" | "up" | "down";
  • 数字字面量类型：type StatusCode = 200 | 404 | 500;
  • 布尔字面量类型：type Toggle = true | false;

特点：

  • 通过联合类型（|）组合多个字面量，实现精确的值约束。
  • 常用于函数参数校验或状态管理。

示例：

function setAlignment(align: "left" | "center" | "right") {
  console.log(`Aligning to ${align}`);
}
setAlignment("center"); // 合法
setAlignment("top");    // 编译错误：参数类型不匹配

2. 枚举（Enum）

枚举是 TypeScript 提供的用于定义命名常量集合的特性，分为：

（1）数字枚举（默认）

enum Direction {
  Up,     // 默认值 0
  Down,   // 自动递增为 1
  Left,   // 2
  Right   // 3
}
console.log(Direction.Up); // 输出 0

（2）字符串枚举

enum LogLevel {
  Error = "ERROR",
  Warn = "WARN",
  Info = "INFO"
}
console.log(LogLevel.Error); // 输出 "ERROR"

（3）异构枚举（混合数字和字符串）

enum Result {
  No = 0,
  Yes = "YES"
}

枚举的特性：

  • 反向映射：数字枚举会生成从值到键的反向映射（字符串枚举无此特性）。
    enum Direction { Up = 1 }
console.log(Direction[1]); // 输出 "Up"
  • 常量枚举：使用 const enum 提升性能（编译后直接替换为值）：
    const enum Colors { Red = "#FF0000" }
console.log(Colors.Red); // 编译后变为 console.log("#FF0000");

3. 字面量类型 vs 枚举

特性字面量类型枚举
类型扩展性需手动修改联合类型集中管理，易于扩展
运行时值无额外代码生成生成实际对象（常量枚举除外）
可读性适合简单场景适合复杂常量集合

推荐场景：

  • 字面量类型：简单值集合（如组件 props 的固定选项）。
  • 枚举：需要集中管理或反向映射的常量（如 HTTP 状态码）。

4. 最佳实践

  1. 优先使用常量枚举以减少运行时代码体积。
  2. 避免异构枚举以保持代码清晰。
  3. 字符串枚举适合需要序列化的场景（如日志级别）。
  4. 字面量类型联合可替代简单枚举，减少运行时开销。

示例：枚举与字面量结合

type LogLevel = "ERROR" | "WARN" | "INFO";
const LogLevelEnum = {
  Error: "ERROR" as LogLevel,
  Warn: "WARN" as LogLevel,
  Info: "INFO" as LogLevel
};

注意：TypeScript 5.0+ 引入了更简洁的 const 类型断言语法（如 "ERROR" as const），可进一步优化字面量类型的使用。

Last Updated::