联合类型

        是指一个变量可以有不同的数据类型，通过 | 符号来表示，它的目的是将多个类型组合成一个类型。这些类型可以是基本类型，也可以是自定义类型。

let myVar: string;
myVar = 'hello';
myVar = 123; //error

        使用联合类型

let myVar: string | number;
myVar = 'hello';
myVar = 123;

        自定义类型

interface abc {
    'name' :string
}
let myVar: string | abc;
myVar = 'hello';
myVar = {'name': '前端'}

        函数传参也可以使用联合类型

function printId(id: number | string) {
    console.log(`id is ${id}`);
}

        联合类型的优点是在一些情况下可以简化代码，但缺点是会降低代码的可读性和可维护性。当联合类型过多时，代码的复杂度会显著增加。我们可以用类型别名来提高代码的可读性。

type Message = string | string[];

let greet = (message: Message) => {
  // ...
};

     

交叉类型

        交叉类型是将多个类型组合成一个类型，通过 & 符号来表示。这些类型可以同时拥有所有类型的属性和方法。我们可以将交叉类型看作是“并集”类型。

interface Person {
    name: string;
    age: number;
}
interface Employee {
    company: string;
}
type EmployeePerson = Employee & Person;
const employeePerson: EmployeePerson = {
    name: "John",
    age: 30,
};

这样是报错的。为什么？

因为交叉类型会将两个接口Person 和 Employee 类型组合成一个新的类型。

const employeePerson: EmployeePerson = {
    name: "John",
    age: 30,
    company: "ABC Inc",
};

这样子就不会报错了。那如果是基本类型呢？

答案是不行的。所以交叉类型只能作用在多个对象类型的组合。

交叉类型的优点是可以让我们快速定义具有多种属性和方法的对象类型，但缺点是当交叉类型过多时，代码的复杂度也会显著增加。