TypeScript infer：条件类型中的类型提取魔法 – wiki基地

作者： /

TypeScript infer：解开条件类型中的类型提取魔法

在 TypeScript 浩瀚的类型系统中，存在着一些强大的、甚至堪称“魔法”的特性，它们使得开发者能够以前所未有的精度和灵活性来操纵和表达类型。其中，infer 关键字无疑是皇冠上的一颗璀璨明珠。它主要出现在条件类型（Conditional Types）的 extends 子句中，赋予了我们从复杂类型结构中“提取”并“命名”未知类型的非凡能力。理解并掌握 infer，是迈向 TypeScript 类型编程高级境界的关键一步。本文将深入探讨 infer 的工作原理、应用场景及其背后的“魔法”。

一、 前置知识：理解条件类型

在深入 infer 之前，我们必须先牢固掌握 TypeScript 的条件类型。条件类型允许我们根据一个类型是否满足特定条件，来选择性地应用不同的类型。其基本语法形如：

typescript
T extends U ? X : Y

这里的逻辑非常直观：
1. 检查类型 T 是否可以赋值给（或者说，是否是）类型 U。
2. 如果 T 满足 extends U 的条件（即检查结果为真），则整个条件类型的结果为 X。
3. 如果 T 不满足 extends U 的条件（即检查结果为假），则整个条件类型的结果为 Y。

简单示例：

“`typescript
type IsString = T extends string ? true : false;

type Result1 = IsString<“hello”>; // type Result1 = true
type Result2 = IsString<123>; // type Result2 = false
“`

条件类型是 TypeScript 类型系统进行逻辑判断和类型转换的基础。它们本身已经非常强大，但它们的潜力在引入 infer 关键字后才得到了真正的释放。

二、 infer 登场：从匹配到提取

想象一下，我们不仅仅想知道一个类型 T 是否 是一个数组，我们还想知道这个数组包含的元素类型是什么。或者，我们不仅仅想知道 T 是否 是一个函数，我们还想提取出它的参数类型或返回类型。

传统的条件类型只能做“是/否”的判断。而 infer 关键字的出现，改变了这一切。infer 允许我们在 extends 子句中声明一个临时的、待推断的类型变量。TypeScript 编译器会在类型检查过程中，尝试根据 T 的实际结构去“推断”（infer）这个临时变量所代表的具体类型。

infer 的核心语法：

infer 关键字只能用在条件类型的 extends 子句中，通常放在需要被推断的类型位置。

typescript
T extends SomePattern<infer R> ? R : FallbackType
// 或者更具体的模式
T extends (infer ElementType)[] ? ElementType : T
T extends (...args: infer Args) => any ? Args : never
T extends Promise<infer ValueType> ? ValueType : T

这里的 R、ElementType、Args、ValueType 就是通过 infer 声明的类型变量。它们的名字可以任意取，只要符合 TypeScript 的标识符规则即可。

关键点：

  1. 声明位置： infer 必须出现在 extends 条件判断的右侧（U 的部分）。
  2. 推断过程： 当 TypeScript 尝试将左侧的类型 T 与 extends 右侧包含 infer 的模式进行匹配时，它会试图找出能够使匹配成功的 infer 变量的具体类型。
  3. 作用域： 通过 infer 推断出的类型变量（如 R）仅在条件类型的“真”分支（X 部分）中可用。如果在“假”分支（Y 部分）或条件类型外部引用它，会导致编译错误。
  4. 匹配失败： 如果类型 T 的结构与 extends 右侧的模式不匹配，或者无法成功推断出 infer 变量的类型，则条件判断为假，整个条件类型的结果为“假”分支的类型（Y）。

三、 infer 的实战应用：解锁类型魔法

infer 的威力体现在其广泛的应用场景中。下面我们将通过一系列实例，逐步揭示其强大的类型提取能力。

1. 提取数组/元组元素类型

这是 infer 最经典的用途之一。

提取数组元素类型：

“`typescript
type UnpackArray = T extends (infer ElementType)[] ? ElementType : T;

type StringArray = string[];
type NumberArray = number[];
type MixedType = { a: number };

type UnpackedString = UnpackArray; // type UnpackedString = string
type UnpackedNumber = UnpackArray; // type UnpackedNumber = number
type UnpackedMixed = UnpackArray; // type UnpackedMixed = { a: number } (不匹配数组模式，返回 T 本身)
type UnpackedStringLiteral = UnpackArray<“hello”>; // type UnpackedStringLiteral = “hello” (不匹配数组模式)
“`

  • 解析： T extends (infer ElementType)[] 尝试将 T 匹配到一个数组结构。如果 T 是 string[]，模式匹配成功，TypeScript 推断出 ElementType 为 string。条件为真，返回 ElementType，即 string。如果 T 不是数组（如 { a: number } 或 "hello"），匹配失败，条件为假，返回 T 本身。

提取元组第一个元素类型：

“`typescript
type FirstElement = T extends [infer First, …any[]] ? First : never;

type MyTuple = [string, number, boolean];
type EmptyTuple = [];
type NotATuple = string;

type First = FirstElement; // type First = string
type NoFirst = FirstElement; // type NoFirst = never (空元组不匹配 [infer First, …any[]] 模式)
type AlsoNoFirst = FirstElement; // type AlsoNoFirst = never (非元组不匹配)
“`

  • 解析： [infer First, ...any[]] 这个模式要求 T 是一个至少包含一个元素的元组（或数组）。infer First 尝试捕获第一个元素的类型。...any[] 表示忽略剩余的元素（可以是任意类型，任意数量）。如果 T 是 [string, number, boolean]，First 被推断为 string。如果 T 是空元组 [] 或非元组类型，模式不匹配，返回 never。

提取元组最后一个元素类型：

“`typescript
type LastElement = T extends […any[], infer Last] ? Last : never;

type MyTuple = [string, number, boolean];
type SingleElementTuple = [number];

type Last = LastElement; // type Last = boolean
type SingleLast = LastElement; // type SingleLast = number
type NoLast = LastElement<[]>; // type NoLast = never
“`

  • 解析： [...any[], infer Last] 模式要求 T 是一个至少包含一个元素的元组/数组，并试图捕获最后一个元素的类型。

2. 提取函数参数类型

infer 在处理函数类型时同样表现出色。

提取函数所有参数类型（作为元组）：

“`typescript
type FunctionArgs = T extends (…args: infer Args) => any ? Args : never;

type MyFunc = (a: string, b: number) => void;
type NoArgsFunc = () => boolean;
type NotAFunc = string;

type ArgsTuple = FunctionArgs; // type ArgsTuple = [a: string, b: number]
type EmptyArgsTuple = FunctionArgs; // type EmptyArgsTuple = []
type NeverArgs = FunctionArgs; // type NeverArgs = never
“`

  • 解析： (...args: infer Args) => any 这个模式匹配任何函数类型。...args: infer Args 使用 rest 参数语法来捕获函数的所有参数类型，并将它们推断为一个元组类型赋值给 Args。=> any 表示我们不关心函数的返回类型。

提取函数第一个参数类型：

“`typescript
type FirstArg = T extends (firstArg: infer First, …rest: any[]) => any ? First : never;

type MyFunc = (a: string, b: number) => void;
type SingleArgFunc = (x: boolean) => number;
type NoArgsFunc = () => boolean;

type First = FirstArg; // type First = string
type SingleFirst = FirstArg; // type SingleFirst = boolean
type NoFirstArg = FirstArg; // type NoFirstArg = never (没有第一个参数)
“`

  • 解析： (firstArg: infer First, ...rest: any[]) 模式要求函数至少有一个参数。infer First 捕获第一个参数的类型。

内置工具类型 Parameters<T>：
TypeScript 内置的 Parameters<T> 工具类型正是基于此原理实现的：

typescript
// TypeScript 标准库中的可能实现 (简化版)
// type Parameters<T extends (...args: any) => any> =
// T extends (...args: infer P) => any ? P : never;

3. 提取函数返回类型

与提取参数类似，infer 也能轻松提取函数的返回类型。

“`typescript
type FunctionReturnType = T extends (…args: any) => infer ReturnT ? ReturnT : never;

type FuncReturnsString = () => string;
type FuncReturnsNumber = (a: number) => number;
type NotAFunc = boolean;

type RString = FunctionReturnType; // type RString = string
type RNumber = FunctionReturnType; // type RNumber = number
type RNever = FunctionReturnType; // type RNever = never
“`

  • 解析： (...args: any) => infer ReturnT 模式匹配任何函数，并使用 infer ReturnT 来捕获其返回类型。

内置工具类型 ReturnType<T>：
这正是 TypeScript 内置 ReturnType<T> 工具类型的实现基础：

typescript
// TypeScript 标准库中的可能实现 (简化版)
// type ReturnType<T extends (...args: any) => any> =
// T extends (...args: any) => infer R ? R : any; // 标准库返回 `any` 而非 `never` 以兼容旧版 JS

4. 提取 Promise 的解决值类型

处理异步操作时，经常需要知道 Promise 解决后的值的类型。

“`typescript
type UnwrapPromise = T extends Promise ? Value : T;

type PromiseString = Promise;
type PromiseNumber = Promise;
type JustString = string;

type UnwrappedString = UnwrapPromise; // type UnwrappedString = string
type UnwrappedNumber = UnwrapPromise; // type UnwrappedNumber = number
type UnwrappedNormal = UnwrapPromise; // type UnwrappedNormal = string (非 Promise，返回 T)
“`

  • 解析： Promise<infer Value> 模式匹配一个 Promise 类型，并用 infer Value 捕获其泛型参数（即解决值的类型）。

内置工具类型 Awaited<T>：
TypeScript 4.5 引入的 Awaited<T> 类型更为强大，它可以递归地解开嵌套的 Promise 和 Thenable，其核心也依赖于 infer，但实现更为复杂，涉及到递归条件类型。

typescript
// Awaited<T> 的简化概念 (非实际实现)
// type Awaited<T> =
// T extends null | undefined ? T : // special case for null/undefined
// T extends PromiseLike<infer U> ? Awaited<U> : // 递归解包
// T; // 非 PromiseLike，直接返回

5. 提取构造函数的实例类型

我们可以使用 infer 来获取一个构造函数（类）所创建的实例的类型。

“`typescript
type GetInstanceType = T extends new (…args: any[]) => infer Instance ? Instance : never;

class Person {
constructor(public name: string) {}
}
class Car {
constructor(public make: string, public model: string) {}
}
type NotAConstructor = () => void;

type PersonInstance = GetInstanceType; // type PersonInstance = Person
type CarInstance = GetInstanceType; // type CarInstance = Car
type NeverInstance = GetInstanceType; // type NeverInstance = never
“`

  • 解析： new (...args: any[]) => infer Instance 模式匹配一个构造函数签名。new 关键字表明它是一个构造函数，(...args: any[]) 表示接受任意参数，infer Instance 则捕获构造函数调用后返回的实例类型。注意，我们通常需要对类本身使用 typeof ClassName 来获取其构造函数类型。

内置工具类型 InstanceType<T>：
这正是内置 InstanceType<T> 的实现原理：

typescript
// TypeScript 标准库中的可能实现 (简化版)
// type InstanceType<T extends abstract new (...args: any) => any> =
// T extends abstract new (...args: any) => infer R ? R : any;
(abstract new 是为了支持抽象类)

6. 结合模板字面量类型进行提取

TypeScript 4.1 引入了模板字面量类型，infer 可以与其完美结合，实现对字符串结构模式的匹配和提取。

``typescript
type GetRouteParam<S extends string> =
S extends/users/${infer UserId}` ? UserId : never;

type Route1 = “/users/123”;
type Route2 = “/products/abc”;

type Param1 = GetRouteParam; // type Param1 = “123”
type Param2 = GetRouteParam; // type Param2 = never
“`

  • 解析： S extends \/users/\${infer UserId}`尝试将字符串S匹配到/users/后跟任意字符串的模式。如果匹配成功，infer UserId会捕获/users/之后的部分，并将其作为类型UserId`。

这种能力在处理路由、事件名或其他基于特定字符串模式的场景中非常有用。

``typescript
type ParseEvent<E extends string> =
E extendsclick:${infer ElementId}? { event: 'click', id: ElementId } :
E extendshover:${infer ElementId}` ? { event: ‘hover’, id: ElementId } :
never;

type ClickEvent = ParseEvent<“click:button-1”>; // type ClickEvent = { event: “click”; id: “button-1”; }
type HoverEvent = ParseEvent<“hover:div-abc”>; // type HoverEvent = { event: “hover”; id: “div-abc”; }
type InvalidEvent = ParseEvent<“keypress:key-x”>; // type InvalidEvent = never
“`

四、 理解 infer 的推断机制与细节

1. 推断位置：协变与逆变

infer 的推断行为受到类型系统中协变（Covariance）和逆变（Contravariance）规则的影响。

  • 协变位置（Covariant Position）： 如函数返回值、对象属性、数组元素、Promise 的解决值类型等。在这些位置，如果存在多个可能的推断候选类型（例如，在联合类型上使用 infer），infer 通常会推断出这些候选类型的联合（Union）。

    “`typescript
    type Unpack = T extends { data: infer U } | Array ? U : never;

    type ResultA = Unpack<{ data: string } | number[]>; // type ResultA = string | number
    // 推断过程:
    // { data: string } 匹配 { data: infer U } => U 推断为 string
    // number[] 匹配 Array => U 推断为 number
    // 最终 U 是 string | number
    “`

  • 逆变位置（Contravariant Position）： 最典型的就是函数参数类型。在这些位置，如果存在多个候选类型，infer 通常会推断出这些候选类型的交集（Intersection）。

    “`typescript
    type GetParam = T extends (arg: infer P) => void ? P : never;

    // 传入一个接受 string 或 number 的函数类型 (通过重载或条件类型构造)
    type FuncUnion = ((arg: string) => void) | ((arg: number) => void);
    type ParamType = GetParam; // type ParamType = string & number (即 never)

    // 更常见的例子:
    type GetCommonParam = T extends { a: (arg: infer P) => void, b: (arg: infer P) => void } ? P : never;

    type Example = {
    a: (arg: string | number) => void;
    b: (arg: number | boolean) => void;
    };

    // 推断 P 需要同时满足 string | number 和 number | boolean
    type CommonParam = GetCommonParam; // type CommonParam = number
    // P in a: 推断为 string | number
    // P in b: 推断为 number | boolean
    // 交集是 number
    ``
    理解协变和逆变对于预测复杂场景下    infer` 的行为至关重要，但这本身是一个更深入的话题。对于多数常见用例，直观的模式匹配理解通常足够。

2. 多个 infer 声明

同一个 extends 子句中可以有多个 infer 声明，用于从不同位置捕获类型。

“`typescript
type ExtractParts =
T extends { data: infer D, handler: (arg: infer A) => infer R }
? { data: D, argType: A, returnType: R }
: never;

type MyType = {
data: string;
handler: (arg: number) => boolean;
};

type Parts = ExtractParts;
// type Parts = {
// data: string;
// argType: number;
// returnType: boolean;
// }
“`

3. 推断失败与 never

如果类型 T 的结构与 extends 右侧的模式完全不匹配，或者无法为某个 infer 变量找到一个确定的类型，则条件判断为假，通常返回 never 或指定的“假”分支类型。never 类型在类型系统中常用来表示一个不可能发生的状态或一个无法满足的条件结果。

五、 infer 的意义与价值

infer 关键字不仅仅是一个语法糖，它极大地增强了 TypeScript 类型系统的表达能力和元编程（Metaprogramming）能力：

  1. 类型安全性增强： 通过精确提取和使用类型信息，可以在编译时捕获更多潜在的类型错误，尤其是在处理泛型库、高阶函数或复杂数据结构时。
  2. 代码复用与抽象： 允许创建高度可复用的泛型工具类型（Utility Types），如 Parameters, ReturnType, Awaited 等。开发者也可以定义自己业务领域的特定工具类型，减少重复的类型标注。
  3. 改善开发体验： 复杂的类型逻辑可以被封装在条件类型和 infer 中，使得使用这些类型的代码更简洁、易读。编辑器也能基于这些精确的类型提供更好的智能提示和自动补全。
  4. 库作者的利器： 对于开发泛型库（如状态管理、路由、ORM 等）的作者来说，infer 是构建强大且类型安全 API 的核心工具。它可以根据用户输入的数据结构或函数签名，自动推断出各种关联类型。
  5. 类型层面的计算： infer 结合条件类型、递归类型等，使得在类型层面进行复杂的计算和转换成为可能，实现了某种程度上的“类型级编程”。

六、 总结：驾驭类型提取的魔法

TypeScript 的 infer 关键字，隐藏在条件类型的 extends 子句中，却蕴含着巨大的能量。它赋予了我们洞察和提取类型内部结构的能力，如同一种类型层面的“模式匹配与解构赋值”。从简单的数组元素提取，到复杂的函数签名解析，再到 Promise 解包和模板字面量分析，infer 无处不在，默默支撑着 TypeScript 类型系统的强大功能和灵活性。

初看 infer 可能觉得有些神秘甚至“魔法”，但通过理解其基本语法、工作原理（匹配、推断、作用域）以及丰富的应用场景，你会发现它其实是逻辑严谨、功能强大的工具。掌握 infer，意味着你能够更深入地理解和运用 TypeScript 的类型系统，编写出更健壮、更优雅、类型更安全的代码。它不仅是解决特定类型问题的钥匙，更是通往 TypeScript 高级类型编程和类型元编程世界的重要门径。不断实践和探索 infer 的用法，你将能真正驾驭这股强大的“类型提取魔法”。

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部