字面量类型配合联合类型是 TypeScript 中实现“枚举式精准限定”最轻量灵活的方式,支持字符串、数字、布尔等任意字面量组合,提供强类型提示、零运行时开销,并天然兼容类型守卫、穷尽性检查与映射类型。

字面量类型配合联合类型,是 TypeScript 中实现“枚举式精准限定”最轻量、最灵活的方式——它不依赖 enum 语法,却能提供更强的类型提示、更小的运行时开销,且天然支持字符串、数字、布尔等任意字面量组合。
用字符串字面量联合定义状态集合
直接用 'idle' | 'loading' | 'success' | 'error' 替代传统 enum,既清晰又无额外生成代码:
- 类型声明简洁:
type Status = 'idle' | 'loading' | 'success' | 'error';</li> <li>赋值受严格约束:<code>let s: Status = 'pending';
会报错,因为'pending'不在联合范围内; - 配合类型别名可复用:
type ButtonVariant = 'primary' | 'secondary' | 'danger';,多个组件共用同一约束; - 自动推导判别字段:当该类型作为对象属性(如
{ status: Status })时,后续可用if (x.status === 'success')触发类型收窄。
数字和布尔字面量联合增强逻辑边界
不只是字符串,数字和布尔值也能构成精准枚举:
- HTTP 状态码子集:
type HttpStatus = 200 | 201 | 400 | 401 | 404 | 500; - 开关类配置:
type AutoSave = true | false | 'debounced';(混合类型也合法); - 版本标识:
type ApiVersion = 'v1' | 'v2' | 3;(字符串与数字并存,适用于前后端协议兼容场景)。
配合类型保护实现安全分支处理
字面量联合 + 类型守卫,让运行时判断变成编译期保障:
- 使用
===比较字面量字段,TS 自动缩小类型范围; - 例如:
function handleResult(r: { type: 'success' | 'error'; data?: any; error?: string }) { if (r.type === 'success') { r.data.toUpperCase(); // ✅ 此时 r 的 type 已被收窄为 'success' } }; - 搭配
switch可启用穷尽性检查(开启strictNullChecks和noImplicitReturns后,漏写 case 会报错)。
进阶:用映射类型+字面量联合生成完整接口
把字面量联合当作“键源”,批量构造带语义的结构:
type ThemeMode = 'light' | 'dark' | 'system';type ThemeColors = { [K in ThemeMode]: { primary: string; bg: string } };- 结果类型等价于:
{ light: {...}, dark: {...}, system: {...} },键名完全由字面量联合驱动,不会拼错、不会多写。


















