TS 中的类型验算,高级通用 API 实现

简介: 这篇文章介绍了一些常用的类型通用API封装,包括TS内置类型和关键字的使用,以及TS compiler内部实现的类型。文章截取了一些常用的类型定义和API示例,如Partial、Required、Readonly、NonNullable、Parameters等。还介绍了一些常用的TS关键字,如extends、infer、keyof、typeof、in等。此外,文章还提供了一些实现示例,如Optional API、GetOptional API和UnionToIntersection API。该文章会不断更新。

前言

由于现在工作使用的技术栈是 ReactTypeScriptahooks,工作中需要用到大量的类型定义,特此记录一下一些常用的 类型通用API 封装。

TS 内置类型

  • Partial<T>:将 T 所有属性变为可选属性
  • Required<T>:将 T 所有属性变为必选属性
  • Readonly<T>:将 T 所有属性变为只读属性
  • NonNullable<T>:过滤 T 类型中的 null 及 undefined 类型
  • Parameters<T>:获取函数的参数类型,将每个参数类型放在一个元组中
  • Omit<T, K>:从类型 T 中剔除 K 中的所有属性
  • Pick<T, K>:从类型 T 中挑选 K 中的所有属性
  • Exclude<T, U>:提取存在于 T,但不存在于 U 的类型组成的联合类型
  • Extract<T, U>:提取联合类型 T 和联合类型 U 的所有交集
  • Record<T, K>:构造一个具有一组属性 K (类型 T )的类型

TS 内置关键字

  • extends:继承、泛型约束、条件类型
  • infer:这玩意我到现在都还没搞懂
  • keyof:将一个类型的属性名全部提取出来当做联合类型
  • typeof:在类型上下文中获取变量或者属性的类型
  • in:常用来遍历枚举类型

TS compiler 内部实现的类型

  • Uppercase:构造一个将字符串转大写的类型
  • Lowercase:构造一个将字符串转小写的类型
  • Capitalize:构造一个将字符串首字符转大写的类型
  • Uncapitalize:构造一个将字符串首字符转大小写的类型

实现 Optional API,实现部分类型变为可选

type Article = {
   
  title: string;
  content: string;
  author: string;
  date: Date;
  readCount: number;
}

// 实现 T 部分类型变为可选
type Optional<T,K extends keyof T> = Omit<T,K> & Partial<Pick<T,K>>; 

type ArticleTodo = Optional<Article,'author' | 'date' | 'readCount'>
// { title: string; content: string; author?: string; date?: Date; readCount?: number; }

实现 GetOptional API,获取类型中的所有可选字段

type Article = {
   
  title: string;
  content: string;
  author?: string;
  date?: Date;
  readCount?: number;
}

// 获取 T 类型中的所有可选字段
type GetOptional<T> = {
   
  [P in keyof T as T[P] extends Required<T>[P] ? never : P]: T[P]
};

type ArticleTodo = GetOptional<Article>
// { author?: string; date?: Date; readCount?: number; }

实现 DeepReadonly API,实现不可变类型的深度遍历

type Article = {
   
  title: string;
  name:{
   
    first:string;
    lasr:string;
  }
}

// API,实现不可变类型的深度遍历
type DeepReadonly<T extends Record<string | symbol,any>> = {
   
  readonly [k in keyof T]: DeepReadonly<T[K]>;
};

type ArticleTodo = DeepReadonly<Article>

实现 UnionToIntersection API,将联合类型转为交叉类型

type Article = {
    title:string } | {
    name:string } | {
    date: Date }

// API,将联合类型转为交叉类型
type UnionToIntersection<T> = 
  (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never;

type ArticleTodo = UnionToIntersection<Article>
// { title:string } & { name:string } & { date: Date }

{cat_tips_info color=""}本篇文章会不间断更新。{/cat_tips_info}

相关文章
|
1月前
|
安全 前端开发 物联网
现代 API 的类型划分
【2月更文挑战第28天】
|
1月前
|
JavaScript API
【vue实战项目】通用管理系统:api封装、404页
【vue实战项目】通用管理系统:api封装、404页
43 3
|
5天前
|
JavaScript 前端开发 测试技术
【vue实战项目】通用管理系统:api封装、404页
【vue实战项目】通用管理系统:api封装、404页
15 3
|
1月前
|
机器学习/深度学习 API TensorFlow
TensorFlow的高级API:tf.keras深度解析
【4月更文挑战第17天】本文深入解析了TensorFlow的高级API `tf.keras`,包括顺序模型和函数式API的模型构建,以及模型编译、训练、评估和预测的步骤。`tf.keras`结合了Keras的易用性和TensorFlow的性能,支持回调函数、模型保存与加载等高级特性,助力提升深度学习开发效率。
|
7月前
|
API 流计算 知识图谱
Flink教程(15)- Flink高级API(并行度)
Flink教程(15)- Flink高级API(并行度)
72 0
|
1月前
|
XML API 网络架构
API 常用的接口类型都有哪些?
在软件开发的宏大舞台上,接口充当着不可或缺的角色,确保了不同的软件模块能够高效、无缝地沟通和协作。
|
1月前
|
机器学习/深度学习 人工智能 API
人工智能应用工程师技能提升系列2、——TensorFlow2——keras高级API训练神经网络模型
人工智能应用工程师技能提升系列2、——TensorFlow2——keras高级API训练神经网络模型
53 0
|
1月前
|
XML API 网络架构
API的类型及其区别是什么?
API的类型及其区别是什么?
119 0
|
1月前
|
JSON 关系型数据库 MySQL
这个问题是由于Flink的Table API在处理MySQL数据时,将MULTISET类型的字段转换为了JSON格式
【1月更文挑战第17天】【1月更文挑战第84篇】这个问题是由于Flink的Table API在处理MySQL数据时,将MULTISET类型的字段转换为了JSON格式
45 1
|
1月前
|
存储 API 数据安全/隐私保护
2021年最新最全Flink系列教程__Flink高级API(四)
2021年最新最全Flink系列教程__Flink高级API(四)
38 0