返回

TypeScript 的 Utility Types:让你的代码更简洁高效

前端

TypeScript 作为 JavaScript 的超集,在类型系统上提供了很多有用的特性,其中 Utility Types 就是一个非常重要的特性。Utility Types 是一组内置工具类型,可以帮助你编写更简洁、更易读的代码。

在本文中,我们将介绍 20 种内置 Utility Types 和 16 个手写工具类型,并通过示例展示如何使用它们。即使你对 TypeScript 还不太熟悉,也可以通过本文快速上手,并将其应用到你的项目中。

内置 Utility Types

TypeScript 内置了 20 种 Utility Types,它们可以帮助你处理各种类型操作。这些类型包括:

  • Partial<T>:创建一个新类型,该类型是 T 的部分类型,其中一些属性可以是可选的。
  • Required<T>:创建一个新类型,该类型是 T 的必填类型,其中所有属性都必须存在。
  • Readonly<T>:创建一个新类型,该类型是 T 的只读类型,其中所有属性都只能被读取,不能被修改。
  • Pick<T, K>:创建一个新类型,该类型只包含 T 中指定的属性 K
  • Omit<T, K>:创建一个新类型,该类型包含 T 中的所有属性,除了指定的属性 K
  • Exclude<T, U>:创建一个新类型,该类型包含 T 中的所有属性,除了那些与 U 重叠的属性。
  • Intersection<T, U>:创建一个新类型,该类型包含 TU 的所有属性。
  • Union<T, U>:创建一个新类型,该类型包含 TU 的所有属性。
  • Tuple<T, U>:创建一个新类型,该类型包含一个固定长度的元组,其中第一个元素类型是 T,第二个元素类型是 U,依此类推。
  • Array<T>:创建一个新类型,该类型是一个数组,其中每个元素的类型都是 T
  • ReadonlyArray<T>:创建一个新类型,该类型是一个只读数组,其中每个元素的类型都是 T
  • Function:创建一个新类型,该类型表示一个函数。
  • Never:创建一个新类型,该类型表示一个永远不会发生的值。
  • Unknown:创建一个新类型,该类型表示一个未知的值。
  • Any:创建一个新类型,该类型表示任何值。
  • Null:创建一个新类型,该类型表示一个 null 值。
  • Undefined:创建一个新类型,该类型表示一个 undefined 值。
  • Boolean:创建一个新类型,该类型表示一个布尔值。
  • Number:创建一个新类型,该类型表示一个数字值。
  • String:创建一个新类型,该类型表示一个字符串值。

手写工具类型

除了内置 Utility Types 之外,你还可以编写自己的手写工具类型。手写工具类型可以帮助你解决一些更复杂的问题。

以下是一些常见的