掌握 TypeScript 中的联合类型和交叉类型：快速指南与示例

Source: Dev.to

联合类型

• 当变量或参数可以持有多种类型的值时使用联合类型。

语法： typeA | typeB

示例：

let value: string | number;
value = "hello"; // 有效
value = 42;      // 有效
value = true;    // 无效

交叉类型

• 使用交叉类型将多个类型合并为一个。
• 结果类型拥有每个类型的所有属性。

语法： typeA & typeB

示例：

type A = { a: number };
type B = { b: string };
let obj: A & B = { a: 1, b: "hello" };

关键区别

• 联合 (|)：接受匹配任意成员类型的值。
• 交叉 (&)：要求值同时满足所有成员类型。

实际示例

假设你有以下用户类型：

type Admin = { name: string; admin: true };
type User = { name: string; admin?: false };

type AnyUser = Admin | User; // 可以是 Admin 或 User

function greet(user: AnyUser) {
  console.log(`Hello, ${user.name}`);
}

使用时机

• 当数据可以有不同形状时使用联合。
• 当需要将多个需求合并为单一类型时使用交叉。