当前位置: 首页 > news >正文

TypeScript 中的 infer 关键字用途

infer 是 TypeScript 中的高级类型关键字,主要用于条件类型中推断类型。它允许我们在条件类型的 extends 子句中声明一个类型变量,然后在该条件类型的 true 分支中使用这个推断出的类型。

1. 基本语法

type SomeType<T> = T extends infer U ? U : never;

2. 主要用途

1. 从复杂类型中提取子类型;

2. 实现类型解构;

3. 创建更灵活的工具类型;

3. 常见示例

3.1. 提取函数返回类型

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;

function foo(): number {
  return 42;
}

type FooReturn = ReturnType<typeof foo>; // number

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

type ElementType<T> = T extends (infer U)[] ? U : never;

type StrArray = string[];
type StrElement = ElementType<StrArray>; // string

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

type UnpackPromise<T> = T extends Promise<infer U> ? U : T;

type PromiseNumber = Promise<number>;
type NumberType = UnpackPromise<PromiseNumber>; // number

3.4. 提取函数参数类型

type Parameters<T> = T extends (...args: infer P) => any ? P : never;

function bar(a: string, b: number): void {}
type BarParams = Parameters<typeof bar>; // [string, number]

3.5. 提取构造函数实例类型

type InstanceType<T> = T extends new (...args: any[]) => infer R ? R : any;

class MyClass {}
type MyInstance = InstanceType<typeof MyClass>; // MyClass

3.6. 实现类型反转(将元组类型顺序反转)

type Reverse<T> = T extends [infer First, ...infer Rest] 
  ? [...Reverse<Rest>, First] 
  : T;

type Original = [1, 2, 3];
type Reversed = Reverse<Original>; // [3, 2, 1]

4. 注意事项

1. infer 只能在条件类型的 extends 子句中使用;

2. 同一类型变量可以在多个位置进行 infer,但必须推断出相同的类型;

3. 如果无法推断出类型,则条件类型会返回 never 或指定的默认类型;

infer 是 TypeScript 类型编程中非常强大的工具,它使得类型操作更加灵活和强大,特别是在创建复杂工具类型时非常有用。

相关文章:

  • C++11QT复习 (十六)
  • C++继承完全指南:从语法到设计模式----图解原理+工业级代码示例+陷阱规避
  • mnggiflab-gif压缩功能更新
  • C++学习之本地套接字libevent
  • C++ :特殊类设计
  • 空值处理操作符
  • 如何深刻理解Reactor和Proactor
  • MySQL学习笔记四
  • 城电科技 | 太阳能花怎么选择?光伏太阳花的应用场景在哪里?
  • 用 HTML、CSS 和 jQuery 打造多页输入框验证功能
  • ES:geoip_databases
  • AWS SNS深度解析:构建高可用、可扩展的云原生消息通信解决方案
  • 基于Java的人脸识别在线考试系统(jsp+springboot+mysql8.x)
  • 在PPT中同时自动播放多个视频的方法
  • AI智慧共治新未来——社会综合治理智慧化系统
  • 关于Spring MVC中传递数组参数的详细说明,包括如何通过逗号分隔的字符串自动转换为数组,以及具体的代码示例和总结表格
  • 十四届蓝桥杯Java省赛 B组(持续更新..)
  • 使用 Vue 快速集成 FullCalendar 日历组件教程
  • SpringBoot整合sa-token,Redis:解决重启项目丢失登录态问题
  • 滑动窗口-最小覆盖字串
  • .web 建设网站/博客网站seo
  • 哪里可以免费建网站/近三天重大新闻摘抄
  • 傻瓜式做网站/教育培训机构排名
  • 武汉麦诺信网站建设/网站建站流程
  • 只做同城交易的网站/排名优化哪家专业
  • pjax wordpress/软件网站关键词优化