typescript 模板字面量类型是编译期推导字符串组合的类型安全工具,支持字面量联合类型插值、交叉组合、infer 解析及 as const 推导,适用于 css 类名、api 路径等固定格式场景。

在 TypeScript 中,模板字面量类型(Template Literal Types)是构建**类型安全的字符串组合**的核心工具,特别适合处理固定格式、可预测结构的字符串(比如 CSS 类名、API 路径、事件名等)。它不是运行时拼接,而是编译期推导类型,让错误提前暴露。
基础语法:用 `${T}` 拼接字面量与类型
模板字面量类型使用反引号和插值语法,但插值内容必须是**字符串字面量类型、联合类型或其他模板字面量类型**,不能是任意 string 或运行时变量。
-
✅ 正确:
type Path = `/${"users" | "posts"}/${string}`;→ 类型为"/users/xxx"或"/posts/123" -
❌ 错误:
const id = Math.random().toString(); type Bad = `/${id}`;——id是string类型,非字面量,无法参与模板推导
组合联合类型生成所有可能字符串
把多个字面量联合类型放进插值中,TypeScript 会自动交叉组合,生成所有合法组合的联合类型。
完整的Galileo AI平台 TypeScript/JS SDK 参考,用于评估、观察和保护 GenAI 应用。适用于构建 Node.js 或 TypeScript 项目。
type Status = "success" | "error" | "loading";-
type Message = `${Status}-message`;→ 等价于"success-message" | "error-message" | "loading-message" - 支持多层嵌套:
type EventName = `${"click" | "hover"}-${"start" | "end"}`;→"click-start" | "click-end" | "hover-start" | "hover-end"
提取与约束:配合 infer 和条件类型做解析
模板字面量类型常与条件类型 + infer 配合,实现“类型层面的字符串解析”,比如从路径中提取 ID 类型。
type ExtractId<s extends string> = S extends `/user/${infer Id}` ? Id : never;</s>-
type A = ExtractId;→"123" -
type B = ExtractId;→never(不匹配) - 注意:
infer只能在条件类型中使用,且被推导的部分必须是**连续、无歧义的子串**
实用技巧:结合 as const 和映射类型增强类型推导
避免手动枚举,让字面量类型从常量数组自动推导,再注入模板中。
const sizes = ["sm", "md", "lg"] as const;type Size = typeof sizes[number]; // "sm" | "md" | "lg"-
type ClassName = `text-${Size}` | `p-${Size}`;→ 安全生成"text-sm","p-lg"等 - 还可进一步泛型化:
type Prefixed<t extends string p> = `${P}-${T}`;</t>
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










