介绍
在 TypeScript 中，我们可以使用交叉类型和联合类型来组合多个类型。这两种类型可以帮助我们更好地组织代码和定义类型。
交叉类型表示同时具有多个类型的组合，而联合类型表示具有多种可能的类型。两种类型都在 TypeScript 中很有用，可以帮助我们更好地描述对象的结构。
交叉类型
交叉类型使用 & 符号来表示。例如，我们有以下两种类型：
-- -------------------- ---- ------- --------- ----- - ----- ------- ---- ------- - --------- ------ - ----- ------- ----- ------- -
我们可以使用交叉类型定义一个同时具有这两种类型的对象：
type IUserAdmin = IUser & IAdmin;
const userAdmin: IUserAdmin = {
name: 'John Doe',
age: 30,
role: 'admin',
};这个对象既有 IUser 类型的属性，也有 IAdmin 类型的属性。如果我们尝试将其中一个属性省略，TypeScript 将会报错。
联合类型
联合类型使用 | 符号来表示。它表示一个对象可以具有多种可能的类型。例如，我们有以下两种类型：
-- -------------------- ---- ------- --------- ---------------- - -------- ----- ----- -------------- --------- - --------- -------------- - -------- ------ ------ ------- -
我们可以使用联合类型定义一个既有 ISuccessResponse 类型的响应，也有 IErrorResponse 类型的响应：
-- -------------------- ---- -------
---- --------- - ---------------- - ---------------
-------- ------------------------ ---------- -
-- ------------------ -
---------------------------
- ---- -
------------------------------
-
-这个函数可以接收一个 ISuccessResponse 或 IErrorResponse 的参数。在函数内部，我们可以根据对象的 success 属性来判断响应的类型。如果它为 true，那么这个响应就是一个 ISuccessResponse 类型的响应。
交叉类型和联合类型的结合使用
交叉类型和联合类型还可以结合使用。例如，我们有以下两种类型：
interface IProduct {
name: string;
price: number;
}
interface ISaleProduct {
discount: number;
}我们可以使用联合类型来定义这个对象可以是 IProduct 或 ISaleProduct，再使用交叉类型来给 ISaleProduct 添加 IProduct 的属性：
-- -------------------- ---- ------- ---- --------------------- - -------- - ------------- - ---------- ----- -------- --------------------- - - ----- -------- ------ --- -- ----- ------------ --------------------- - - ----- -------- ------ --- --------- --- --
这个类型定义了一个可以是 IProduct 或是 ISaleProduct 的对象，如果它是 ISaleProduct 的话，那么它必须也能满足 IProduct 的要求。这样我们就可以在 TypeScript 中更好地描述对象的结构。
总结
交叉类型和联合类型在 TypeScript 中非常有用，可以帮助我们更好地描述对象的结构。交叉类型表示同时具有多个类型的组合，联合类型表示具有多种可能的类型。这两种类型还可以结合使用，让我们更好地定义对象的类型。在使用交叉类型和联合类型时，我们需要注意它们的语法，并遵循 TypeScript 类型的定义规则。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651e345195b1f8cacd5e1f2e