TS常用高级类型有哪些,以及如何使用

TypeScript 提供了许多高级类型操作符,用于处理和转换类型。以下是一些常用的高级类型操作符及其用法:

  1. Partial<T>:将类型 T 中的所有属性变为可选。

    type MyPartial = Partial<MyObject>;

  2. Required<T>:将类型 T 中的所有属性变为必需。

    type MyRequired = Required<MyPartial>;

  3. Readonly<T>:将类型 T 中的所有属性变为只读。

    type MyReadonly = Readonly<MyObject>;

  4. Pick<T, K>:从类型 T 中选择指定键类型 K 的属性。

    type MyPick = Pick<MyObject, 'id' | 'name'>;

  5. Record<K, T>:创建一个具有指定键类型 K 和值类型 T 的对象类型。

    type MyRecord = Record<string, number>;

  6. Exclude<T, U>:从类型 T 中排除可以赋值给类型 U 的属性。

    type MyExclude = Exclude<'a' | 'b' | 'c', 'a' | 'b'>;

  7. Extract<T, U>:从类型 T 中提取可以赋值给类型 U 的属性。

    type MyExtract = Extract<'a' | 'b' | 'c', 'a' | 'b'>;

  8. Omit<T, K>:从类型 T 中排除指定键类型 K 的属性。

    type MyOmit = Omit<MyObject, 'id'>;

  9. NonNullable<T>:从类型 T 中排除 nullundefined

    type MyNonNullable = NonNullable<string | null | undefined>;

  10. ReturnType<T>:获取函数类型 T 的返回类型。

    type MyReturnType = ReturnType<() => string>;

这些高级类型操作符可以在 程序中中更灵活地操作和转换类型。根据需求,可以组合使用这些操作符来创建更复杂的类型定义。

相关推荐
FanetheDivine1 小时前
ts中如何描述一个复杂函数的类型
前端·typescript
struggle20251 天前
AxonHub 开源程序是一个现代 AI 网关系统,提供统一的 OpenAI、Anthropic 和 AI SDK 兼容 API
css·人工智能·typescript·go·shell·powershell
执剑、天涯1 天前
通过一个typescript的小游戏,使用单元测试实战(二)
javascript·typescript·单元测试
chéng ௹1 天前
Vue3+Ts+Element Plus 权限菜单控制节点
前端·javascript·vue.js·typescript
武清伯MVP2 天前
阮一峰《TypeScript 教程》学习笔记——基本用法
笔记·学习·typescript
ttod_qzstudio3 天前
解决 Vue 3 + TypeScript 中 v-for 循环类型推断问题
前端·vue.js·typescript
今天头发还在吗4 天前
【React】动态SVG连接线实现:图片与按钮的可视化映射
前端·javascript·react.js·typescript·前端框架
冷冷的菜哥4 天前
react多文件分片上传——支持拖拽与进度展示
前端·react.js·typescript·多文件上传·分片上传
Kisang.4 天前
【HarmonyOS】窗口管理实战指南
前端·华为·typescript·harmonyos·鸿蒙
Dajiaonew5 天前
Vue3 + TypeScript 一篇文章 后端变全栈
前端·javascript·typescript