TypeScript 中的条件类型：如何根据条件选择类型
TypeScript 是 JavaScript 的超集，它增加了类型系统来减少运行时错误并提高代码的可靠性。条件类型是 TypeScript 中一种强大的类型工具，允许我们编写可复用且高效的类型定义。下面，我们将介绍 TypeScript 中的条件类型，以及如何使用它们来根据不同的条件选择不同的类型。
什么是条件类型？
条件类型是 TypeScript 中的一种类型工具，用于根据条件选择不同的类型。条件类型通常使用一个三元类型表达式，包含三个部分：
- 类型 T，代表待检测的类型；
- 类型 K，代表要检测的条件；
- 如果条件为 true，返回的类型 U；如果条件为 false，返回的类型 V。
举个例子，我们可以定义一个条件类型，当类型 T 是数组时，返回它的元素类型；否则返回 never 类型：
type ArrayElementType<T> = T extends Array<infer U> ? U : never;
在上面的例子中，我们使用了 extends 关键字，它用于检查类型 T 是否是 Array<infer U> 的子类型。如果是，我们返回 infer U，这是一种特殊的类型占位符，代表数组元素的类型；否则返回 never 类型。
如何使用条件类型？
使用条件类型可以在许多场景下提高代码的复用性和可读性。下面我们介绍一些应用场景，以及如何使用条件类型来解决这些问题。
- 访问对象属性
当我们使用字面量类型作为对象 key 时，经常会遇到这样的情况：访问一个不存在的 key，导致程序运行时错误。为了避免这种情况，我们可以使用条件类型和索引类型来访问对象属性。
type StrictObject<T> = T extends object ? { [K in keyof T]: StrictObject<T[K]> } : T;在上面的例子中，我们定义了一个 StrictObject 条件类型，它可以将任意类型 T 转换为一个对象类型，其中每个属性都被嵌套在一个严格的对象中。通过使用 [K in keyof T]，我们可以访问对象的 key，并使用递归方式将对象的每个子属性都嵌套在严格的对象中。如果 T 不是对象类型，则返回 T。
例如，我们可以使用 StrictObject 类型来定义一个严格的配置对象：
interface AppConfig {
apiUrl: string;
language: string;
theme?: 'dark' | 'light';
}
type StrictConfig = StrictObject<AppConfig>;使用 StrictConfig 类型，我们可以确保在运行时不存在 AppConfig 中未定义的属性。
- 处理可选属性
当我们定义对象类型时，经常会遇到一些可选属性。在某些情况下，我们需要使用这些属性，但是在另一些情况下，我们需要忽略它们。通过使用条件类型，我们可以根据不同的条件选择相应的类型。
type WithOptional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>
在上面的例子中，我们定义了一个 WithOptional 条件类型，它接受两个参数：原始类型 T 和要变成可选属性的 key。我们使用 Omit<T, K> 去除所有的可选 key，然后添加一个可选的 Partial<Pick<T, K>> 类型。如果 K 不在 T 的 key 中，那么不会做任何变化，直接返回 T。
例如，我们可以使用 WithOptional 类型定义一个具有可选属性的 user 对象：
interface User {
name: string;
age: number;
email?: string;
}
type OptionalEmailUser = WithOptional<User, 'email'>;通过使用 OptionalEmailUser 类型，我们可以在不改变原始 user 对象的前提下，将属性 email 转换为可选属性。
- 处理键值对类型
在 TypeScript 中，键值对类型经常被用来表示通用类型，如 hashmap 或字典。然而，在进行某些操作时，可能需要对键和值进行单独的处理。条件类型允许我们对键和值进行单独的映射。
type MapKeys<T, F extends (key: keyof T) => keyof any> = {
[K in F]: T[Extract<keyof T, K>]
};
type MapValues<T, F extends (value: any) => any> = {
[K in keyof T]: F<T[K]>
};在上面的例子中，我们定义了两个条件类型：MapKeys，它通过将对象的 key 映射到一个新值来映射键;MapValues，它通过将对象的值映射到一个新值来映射值。
例如，我们可以使用 MapKeys 类型将 user 对象的 key 映射为大写：
type UpperCaseUserKeys = MapKeys<User, (key: keyof User) => Uppercase<`${key}`>>;使用 UpperCaseUserKeys 类型，我们可以将 user 对象的 key 映射为大写。同样的，我们可以使用 MapValues 类型将 user 对象中的 number 类型转换为 string 类型：
type StringifyUser = MapValues<User, (value: any) => string>;
使用 StringifyUser 类型，我们可以将 user 对象中的 age 属性类型转换为 string 类型。
总结
条件类型是 TypeScript 中一种强大的类型工具，可以让我们根据条件选择不同的类型。在前端开发中，我们可以使用条件类型在许多场景下提高代码的复用性和可读性。在本文中，我们介绍了几个常见的应用场景，并提供了相应的示例代码。希望这篇文章能为您提供一些参考。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/652ceb2e7d4982a6ebe7218a