深入研究打字稿＆＃s推断关键字-js教程-PHP中文网

深入研究打字稿＆＃s推断关键字

聖光之護

发布： 2025-01-30 22:42:01

原创

1001人浏览过

使用typescript条件类型中的infer关键字进行类型推断

本文介绍TypeScript中infer关键字在条件类型中的用法，尤其是在处理复杂类型时，它能有效地提取或转换类型信息。

基本用法

infer关键字只能用于条件类型中，通常与extends关键字结合使用。其语法如下：

<code class="typescript">type InferType<T> = T extends infer U ? U : never;</code>

登录后复制

其中，T extends infer U 表示尝试推断T的类型并将其赋值给U。如果类型推断成功，U将成为推断出的类型。

以下是一些示例：

<code class="typescript">type InferType<T> = T extends infer U ? U : never;

type StringType = InferType<string>; // string
type NumberType = InferType<number>; // number
type UnionType = InferType<string | number>; // string | number

interface User {
  name: string;
  age: number;
}

type UserType = InferType<User>; // User</code>

登录后复制

这些例子中，InferType<T> 实际上只是返回T本身，没有进行任何转换或处理，主要用于演示条件类型和类型推断的基本用法。

常见示例

提取函数的返回类型

假设我们有一个函数类型，需要提取其返回类型：

<code class="typescript">type GetReturnType<T> = T extends (...args: any[]) => infer R ? R : never;

type ExampleFunction = (x: number, y: string) => boolean;
type ReturnTypeOfExampleFunction = GetReturnType<ExampleFunction>; // boolean</code>

登录后复制

代码解释：T extends (...args: any[]) => infer R 检查T是否为函数类型；infer R 推断函数的返回类型并赋值给R；? R : never 如果T是函数类型则返回推断出的返回类型R，否则返回never。

提取数组的元素类型

同样可以使用infer提取数组的元素类型：

<code class="typescript">type GetArrayElementType<T> = T extends (infer U)[] ? U : never;

type MyArray = string[];
type ElementTypeOfMyArray = GetArrayElementType<MyArray>; // string</code>

登录后复制

T extends (infer U)[] 推断数组元素类型U。由于T是string[]，U将是string。

猫眼课题宝

5分钟定创新选题，3步生成高质量标书！

262

查看详情

提取Promise的值类型

对于Promise类型，可以提取其解析类型：

<code class="typescript">type GetPromiseValueType<T> = T extends Promise<infer U> ? U : never;

type ExamplePromise = Promise<number>;
type ValueTypeOfExamplePromise = GetPromiseValueType<ExamplePromise>; // number</code>

登录后复制

T extends Promise<infer U> 检查T是否为Promise类型；infer U 推断Promise的解析值类型并赋值给U。

提取函数的参数类型

infer 也可以用来提取函数的参数类型：

<code class="typescript">type GetParameters<T> = T extends (...args: infer P) => any ? P : never;

type ExampleFunction = (a: number, b: string) => void;
type Params = GetParameters<ExampleFunction>; // [number, string]</code>

登录后复制

T extends (...args: infer P) => any 检查T是否为函数类型；infer P 推断函数的参数类型并赋值给P。

提取构造函数的参数类型

类似地，可以提取类的构造函数的参数类型：

<code class="typescript">type ConstructorParameters<T> = T extends new (...args: infer P) => any ? P : never;

class ExampleClass {
  constructor(public a: number, public b: string) {}
}

type Params = ConstructorParameters<typeof ExampleClass>; // [number, string]</code>

登录后复制

高级示例：复杂的类型推断

以下示例展示了在条件类型中使用更复杂的推断逻辑：

<code class="typescript">type IsArray<T> = T extends (infer U)[] ? U : never;
type IsFunction<T> = T extends (...args: any[]) => infer R ? R : never;

type ExtractType<T> = T extends any[]
  ? IsArray<T>
  : T extends (...args: any[]) => any
  ? IsFunction<T>
  : T;

// Examples
type ArrayType = ExtractType<string[]>; // string
type FunctionReturnType = ExtractType<(x: number) => number>; // number
type DefaultType = ExtractType<boolean>; // boolean</code>

登录后复制

总结

infer关键字在TypeScript条件类型中用于从其他类型推断新的类型变量，能够有效地提取和利用特定的子类型或属性，增强了TypeScript类型系统的表达能力和灵活性。它简化了从复杂类型中提取所需部分的过程。

深入研究打字稿＆＃s推断关键字