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>;

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

相关推荐
by__csdn5 小时前
Vue3 setup()函数终极攻略:从入门到精通
开发语言·前端·javascript·vue.js·性能优化·typescript·ecmascript
濮水大叔10 小时前
VonaJS是如何做到文件级别精确HMR(热更新)的?
typescript·node.js·nestjs
刘发财13 小时前
前端一行代码生成数千页PDF,dompdf.js新增分页功能
前端·typescript·开源
黛色正浓16 小时前
【React18+TypeScript】React 18 for Beginners
javascript·react.js·typescript
一只秋刀鱼16 小时前
从 0 到 1 构建 React + TypeScript 车辆租赁后台管理系统
前端·typescript
by__csdn17 小时前
Vue3 生命周期全面解析:从创建到销毁的完整指南
开发语言·前端·javascript·vue.js·typescript·前端框架·ecmascript
沐风。561 天前
TypeScript
前端·javascript·typescript
Hao_Harrision2 天前
50天50个小项目 (React19 + Tailwindcss V4) ✨ | DrinkWater(喝水记录组件)
前端·react.js·typescript·vite7·tailwildcss
江澎涌2 天前
JWorker——一套简单易用的基于鸿蒙 Worker 的双向 RPC 通讯机制
typescript·harmonyos·arkts
南知意-2 天前
开源高性能IM+集成AI能力,基于SpringBoot +Tauri+Vue 3+TypeScript支持全平台与丰富会话模式
typescript·开源·springboot·tauri·工具·im·软件