TypeScript 的类型系统远不止是给变量加个标注那么简单。随着版本迭代，它已经演变成一门图灵完备的"编程语言"，能够在编译期完成复杂的类型计算。本文将从条件类型出发，深入探讨模板字面量类型、映射类型在前端工程化中的实际应用，帮助开发者写出更安全、更智能的类型守卫代码。
一、条件类型：类型层面的 if-else
条件类型是 TypeScript 类型体操的基石，语法形如 T extends U ? X : Y。它让我们能够根据输入类型动态推导输出类型，是构建泛型工具类型的核心。
// infer 关键字：在条件类型中提取子类型
type UnpackPromise<T> = T extends Promise<infer U> ? U : T;
type Result1 = UnpackPromise<Promise<string>>; // string
type Result2 = UnpackPromise<number>; // number
// 递归条件类型：深度展开嵌套结构
type DeepUnpackPromise<T> =
T extends Promise<infer U> ? DeepUnpackPromise<U> : T;
type Deep = DeepUnpackPromise<Promise<Promise<Promise<boolean>>>>; // boolean上面的递归实现可以处理任意层级的 Promise 嵌套，这正是 Awaited<T> 内置工具类型的实现思路。理解 infer 的位置很关键：它声明在 extends 右侧，表示"如果类型匹配这个结构，就把内部某个部分捕获到变量 U 中"。
二、模板字面量类型：字符串级别的类型计算
模板字面量类型（Template Literal Types）允许我们对字符串类型做拼接、截取、替换操作，这在处理路由、事件名、属性路径等场景下极为强大。
// 从路由参数提取动态段
type ExtractParams<T extends string> =
T extends \`${infer Start}/:${infer Param}/${infer Rest}\`
? { [K in Param | keyof ExtractParams<Start> | keyof ExtractParams<Rest>]: string }
: T extends \`${infer _}/:${infer Param}\`
? { [K in Param]: string }
: {};
type Params = ExtractParams<"/users/:userId/posts/:postId">;
// { userId: string; postId: string }
// 类型安全的对象属性选择器
type Get<T, P extends string> =
P extends \`${infer Key}.${infer Rest}\`
? Key extends keyof T ? Get<T[Key], Rest> : never
: P extends keyof T ? T[P] : never;
type Path = Get<{ user: { name: string; age: number } }, "user.name">; // string这段代码实现了一个类型层面的路径访问器，可以在编译期校验形如 "user.name" 的属性路径合法性，并精确推导出最终值的类型。这在设计类型安全的表单库或状态管理工具时非常实用。
三、映射类型与键重映射
TypeScript 4.1 引入的键重映射（Key Remapping）让映射类型如虎添翼，配合 as 子句可以动态改变输出对象的键名。
// 将蛇形键转为驼峰并添加 on 前缀，构造事件处理器类型
type Camelize<S extends string> =
S extends \`${infer Head}_${infer Tail}\`
? \`${Head}${Capitalize<Camelize<Tail>>}\`
: S;
type EventHandlers<T> = {
[K in keyof T as \`on${Capitalize<string & K>}\`]: (payload: T[K]) => void
};
type Events = EventHandlers<{ click: MouseEvent; value_change: string }>;
// {
// onClick: (payload: MouseEvent) => void;
// onValueChange: (payload: string) => void;
// }注意这里用 string & K 把联合类型的键收窄为字符串类型，才能传入 Capitalize 这样的工具类型。这是处理组件 Props 自动派生事件处理器类型的常见技巧。
四、工程化落地：API响应类型的自动展开
把上述技巧组合起来，可以解决一个真实的工程痛点：后端返回的嵌套对象中，我们把所有可选字段统一加上可选标记，确保访问时必须显式判空。
type DeepOptional<T> = {
[K in keyof T]?: T[K] extends object
? DeepOptional<T[K]> | undefined
: T[K] | undefined;
};
interface UserDTO {
id: number;
profile: {
name: string;
address: { city: string; zip: string };
};
}
type OptionalUser = DeepOptional<UserDTO>;
// 所有层级属性变为可选，访问前必须判断五、性能与可读性的平衡
类型体操虽强大，但也要避免过度炫技。几个实践建议：第一，递归深度有限制（默认约 50 层），过于复杂的递归会触发编译错误；第二，复杂类型推导会让 IDE 智能提示延迟，影响开发体验；第三，始终为复杂工具类型配 @example 注释和单元测试，用断言式类型测试保证行为正确；第四，当类型计算超出一屏可读范围时，考虑拆成多个具名中间类型，而不是堆成一个巨型表达式。
TypeScript 类型系统的精妙之处在于：它在不增加运行时开销的前提下，把大量错误拦截在编译期。掌握条件类型、模板字面量和映射类型的组合应用，你就能构建出具备自文档化和自校验能力的类型层基础设施，让团队协作时的接口契约更加牢固可靠。