面试题：TypeScript 中联合类型与交叉类型的区别

Question

请阐述 TypeScript 里联合类型（Union Types）与交叉类型（Intersection Types）在定义、使用场景以及特性上的区别，并各举一个代码示例说明。

Answer 1

定义区别

• 联合类型：表示取值可以为多种类型中的一种，使用 | 符号连接不同类型。例如 string | number 表示该变量可以是字符串类型或者数字类型。
• 交叉类型：表示取值必须同时满足多种类型的要求，使用 & 符号连接不同类型。例如 {name: string} & {age: number} 表示该对象必须同时有 name 属性（字符串类型）和 age 属性（数字类型）。

使用场景区别

• 联合类型：
  • 用于描述可能出现多种类型值的场景，比如一个函数可能接收字符串或者数字作为参数。
  • 当一个变量在不同情况下有不同类型时使用。
• 交叉类型：
  • 用于合并多个类型的特性，比如将一个拥有某些属性的对象类型与另一个拥有其他属性的对象类型合并。
  • 当需要一个对象同时具备多个类型的所有属性和方法时使用。

特性区别

• 联合类型：只要满足其中一种类型即可，对值的约束相对宽松。当访问联合类型的属性或方法时，只能访问所有类型共有的部分。
• 交叉类型：必须同时满足所有类型的要求，对值的约束更严格。它会将多个类型的成员合并到一起。

代码示例

• 联合类型示例

function printValue(value: string | number) {
    if (typeof value === 'string') {
        console.log(value.length);
    } else {
        console.log(value.toFixed(2));
    }
}

printValue('hello');
printValue(123);

• 交叉类型示例

interface Person {
    name: string;
}

interface Employee {
    company: string;
}

let john: Person & Employee = {
    name: 'John',
    company: 'ABC Company'
};
console.log(john.name);
console.log(john.company);