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

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

相关推荐
濮水大叔2 天前
在 DTO 中使用 Form Layout 配置复杂表单,支持 Tabs/Groups/Sections
vue.js·typescript·node.js
用户0934077735143 天前
HarmonyOS WPS Open SDK 实践:用能力分层重构 OpenFileRequest
typescript·harmonyos
gis开发之家4 天前
vue3直击架构痛点 依赖倒置与接口隔离——打造坚如磐石的插件与高阶组件(HOC)模式
javascript·架构·typescript·前端框架·vue3
冬枳4 天前
基于OpenSeagragon封装的前端病理切片展示组件
前端·typescript
退休倒计时4 天前
【每日一题】LeetCode 287. 寻找重复数 TypeScript
算法·leetcode·typescript
@@@@@@@@545 天前
JavaScript 的缺点与 TypeScript 的弥补
开发语言·javascript·typescript
用户0934077735145 天前
HarmonyOS WPS Open SDK 实践:最小打开闭环与 enableEdit 分支处理
typescript·harmonyos
柯克七七6 天前
我把 bug 修得太干净了,测试组以为这个模块本来就没问题
前端·javascript·typescript
退休倒计时6 天前
【每日一题】LeetCode 39. 组合总和 TypeScript
算法·leetcode·typescript
yyt3630458416 天前
KlineChartQuant Tooltip 高频交互 200FPS 性能优化完整复盘
前端·经验分享·性能优化·typescript·vue·交互·chrome devtools