TypeScript 如何区分并集和交集类型？ - 前端面试题

TypeScript 中的并集（Union）类型和交集（Intersection）类型是两种强大的类型系统特性，用于组合多个类型。下面我将详细解释它们的区别以及如何使用它们，并举例说明。

并集类型（Union Types）

并集类型是指一个值可以是几种类型中的任意一种。在 TypeScript 中，我们使用管道符号 | 来定义并集类型。并集类型用于表示一个变量可以容纳不同类型的值。

例子：

假设我们有一个函数，该函数接受的参数可以是数字或字符串，我们可以这样定义这个函数的参数类型：

typescript
function printId(id: number | string) {
  if (typeof id === "number") {
    console.log(`Your ID is: ${id}.`);
  } else {
    console.log(`Your ID is: ${id}.`);
  }
}

printId(101);       // 输出: Your ID is: 101.
printId("202");     // 输出: Your ID is: 202.

在这个例子中，id 参数是一个并集类型，可以是 number 或 string。

交集类型（Intersection Types）

交集类型是指一个值必须满足多个类型。在 TypeScript 中，我们使用 & 符号来定义交集类型。它通常用于组合多个类型的属性，使得一个变量同时具备这些类型的所有属性。

例子：

假设我们有两个接口，一个是 Employee 和另一个是 Manager：

typescript
interface Employee {
  employeeId: number;
  age: number;
}

interface Manager {
  stockPlan: boolean;
}

type EmployeeManager = Employee & Manager;

function promoteToManager(person: EmployeeManager) {
  console.log(`Employee ${person.employeeId} of age ${person.age} has been promoted and has a stock plan: ${person.stockPlan}`);
}

const newManager: EmployeeManager = {
  employeeId: 1234,
  age: 45,
  stockPlan: true
};

promoteToManager(newManager);

在这个例子中，EmployeeManager 是一个交集类型，它结合了 Employee 和 Manager 的属性，因此一个 EmployeeManager 类型的对象必须同时具有 Employee 和 Manager 的所有属性。

总结

并集类型用于表示一个值可以属于多个类型中的一种，适用于变量有多种类型可能性的情况。交集类型则要求一个值必须同时符合多个类型的要求，适用于需要类型组合的场景。

理解并区分这两种类型是使用 TypeScript 类型系统的关键，可以帮助开发者编写更安全和更清晰的代码。