ts:条件类型

1. 条件类型表达式 T extends U ? X : Y

基本语法: T extends U ? X : Y

(T 和 U 是类型,而 X 和 Y 是类型或者类型表达式。)

用于判断 T的每个成员 是否是 U 的子类型。如果是,则返回 X,否则返回 Y。最终返回多个Y 联合的结果(never在联合类型中会被忽略)

c 复制代码
1. 基本用法--判断类型
// 判断是不是字符串
type IsString<T> = T extends string ? true : false;
type Result1 = IsString<string>;      // true  
//判断是不是数组
type isArray<T> = T extends Array<any> ? true : false
type testArray = isArray<'123'>
判断是不是对象
type isObject<T> T extends object > true : false
type testObject = isObject<{a:'123'}>
2. 提取元组的类型
type ArrayElementType<T extends any[]> = T extends (infer U)[] ? U : never;  
// 使用示例  
const numbers: number[] = [1, 2, 3];  
type NumberElementType = ArrayElementType<typeof numbers>; // number  
3. 排除null或undefined的类型
type noNull<T> = T extends null | undefined ? never : T
type Result1 = noNull<string | null>
4. 递归条件类型示例
type DeepArrayElementType<T> =  
  T extends any[]  
    ? T[number] extends infer U  
      ? U extends any[]  
        ? DeepArrayElementType<U>  
        : U  
      : never  
    : T;  
  
// 使用通用版本  
type Example5 = DeepArrayElementType<number[][][]>; // number  
type Example6 = DeepArrayElementType<string | number[][]>; // string | number
6. 条件烈类型与泛型类型结合使用

条件表达式可以实现递归

c 复制代码
// 只针对接口的递归
//实现一个泛型 DeepReadonly<T>,它将对象的每个参数及其子对象递归地设为只读。
type X = {
  x: {
    a: 1;
    b: "hi";
  };
  y: "hey";
};

type Expected = {
  readonly x: {
    readonly a: 1;
    readonly b: "hi";
  };
  readonly y: "hey";
};

type DeepReadonly<T> = {
  readonly [P in keyof T]: T[P] extends object ? DeepReadonly<T[P]> : T[P];
};

let zs: DeepReadonly<X> = {
  x: {
    a: 1,
    b: "hi",
  },
  y: "hey",
};
zs.x.b = "xc";

infer

infer 关键字用于在泛型条件类型中推断类型。它允许你声明一个类型变量,该变量会在条件类型被解析时自动推断出具体的类型。
infer 关键字通常与条件类型和映射类型中的 extends 关键字一起使用,但是,infer 并不一定要与 extends 结合使用。
infer 可以在一个条件类型中多次使用,以捕获不同的类型信息。

c 复制代码
1. 提取数组元素类型
type ElementType<T extends any[]> = T extends (infer U)[] ? U : never;  
// 使用示例  
type NumArrayElementType = ElementType<[1, 2, 3, 4]>; // number  
type MixedArrayElementType = ElementType<[1, "two", true]>; // number | "two" | true,但通常这不是我们想要的
2. 提取数组最后一个元素类型
type arr1 = [1, 2, 3]
type FirstElement<T extends any[]> =  
  T extends [...infer First, infer Rest] ? Rest : never;  
type lastTest  = FirstElement<arr1>
3. 提取数组第一个元素类型
type arr2 = ['a', 'b', 'c']
type FirstElement<T extends any[]> =  
  T extends [infer First, ...infer Rest] ? First : never;  
type firstTest  = FirstElement<arr1>
4. 提取函数参数类型
type FunctionParams<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;  
type Params = FunctionParams<(a: string, b: number) => void>; 
5. 提取对象属性值类型
type ValueTypeOfProperty<T, K extends keyof T> = T[K] extends (infer V) ? V : never;  
type Obj = {  
  a: string;  
  b: number;  
};  
type AType = ValueTypeOfProperty<Obj, 'a'>;  
// AType 类型为 string   
6. 提取函数返回类型
type FunctionReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : never;  
type ReturnType = FunctionReturnType<() => string>;  
// ReturnType 类型为 string
7. 提取联合类型中的各个类型
8. 创建类型变换(如数组转换成元组)

2. Exclude

Exclude<T, U>用于从类型 T 中排除所有可分配给类型 U 的成员。

c 复制代码
type T0 = Exclude<"a" | "b" | "c", "a" | "b">;  // "c"  
type T2 = Exclude<string | number | (() => void), Function>;  // string | number

3. Uppercase

ts的 内置条件类型,用于将字符转成大写

c 复制代码
type Greeting = "hello";  
type UppercaseGreeting = Uppercase<Greeting>; // 类型为 "HELLO"  
相关推荐
Yvemil711 分钟前
MQ 架构设计原理与消息中间件详解(二)
开发语言·后端·ruby
程序员是干活的12 分钟前
私家车开车回家过节会发生什么事情
java·开发语言·软件构建·1024程序员节
qiyi.sky19 分钟前
JavaWeb——Vue组件库Element(3/6):常见组件:Dialog对话框、Form表单(介绍、使用、实际效果)
前端·javascript·vue.js
煸橙干儿~~23 分钟前
分析JS Crash(进程崩溃)
java·前端·javascript
哪 吒25 分钟前
华为OD机试 - 几何平均值最大子数(Python/JS/C/C++ 2024 E卷 200分)
javascript·python·华为od
我是陈泽28 分钟前
一行 Python 代码能实现什么丧心病狂的功能?圣诞树源代码
开发语言·python·程序员·编程·python教程·python学习·python教学
安冬的码畜日常32 分钟前
【D3.js in Action 3 精译_027】3.4 让 D3 数据适应屏幕(下)—— D3 分段比例尺的用法
前端·javascript·信息可视化·数据可视化·d3.js·d3比例尺·分段比例尺
优雅的小武先生38 分钟前
QT中的按钮控件和comboBox控件和spinBox控件无法点击的bug
开发语言·qt·bug
虽千万人 吾往矣1 小时前
golang gorm
开发语言·数据库·后端·tcp/ip·golang
创作小达人1 小时前
家政服务|基于springBoot的家政服务平台设计与实现(附项目源码+论文+数据库)
开发语言·python