TypeScript - 交叉类型：初学者的友好指南

你好啊，未来的编码巨星！今天，我们将踏上一段激动人心的旅程，探索TypeScript世界的迷人概念——交叉类型。如果你是编程新手，不用担心——我会成为你的友好向导，我们会一步一步地来。所以，拿起你最喜欢的饮料，舒服地坐好，让我们开始吧！

TypeScript - Intersection Types

什么是交叉类型？

在我们深入了解之前，让我们从一个简单的类比开始。想象你在一个冰淇淋店，你无法决定选择巧克力口味还是香草口味。如果我告诉你，你可以在一个球里同时拥有这两种口味呢？这就是TypeScript中交叉类型的作用——它们允许你将多个类型组合成一个！

在TypeScript中，交叉类型通过合并多个现有类型来创建一个新的类型。就像是说，“我想要一个既有类型A的所有属性，又有类型B的所有属性的类型。”这里的重点是“和”这个词——结果类型将包含两种类型结合后的所有特性。

语法

现在，让我们看看如何在TypeScript中编写交叉类型。语法出奇地简单——我们使用和号（&）来组合类型。下面是基本结构：

type 新类型 = 类型A & 类型B;

就这么简单！我们告诉TypeScript，“嘿，创建一个新类型，让它包含类型A和类型B的一切。”

示例

让我们通过一些示例来实际看看这是如何工作的。我发现现实世界的场景总是有助于巩固概念，所以让我们想象我们正在构建一个游戏！

示例 1：创建一个超级英雄

// 定义一个基本的角色类型
type 角色 = {
name: string;
health: number;
};

// 定义一个超能力类型
type 超能力 = {
power: string;
strength: number;
};

// 使用交叉类型创建一个超级英雄类型
type 超级英雄 = 角色 & 超能力;

// 让我们创建一个超级英雄！
const 钢铁侠: 超级英雄 = {
name: "托尼·斯塔克",
health: 100,
power: "高科技套装",
strength: 85
};

console.log(钢铁侠);

在这个示例中，我们通过组合角色和超能力创建了一个超级英雄类型。我们的钢铁侠对象现在拥有两种类型的属性。酷吧？

示例 2：混合不同类型

交叉类型不仅限于对象。让我们看看如何混合不同类型的类型：

type 可转换为字符串 = string | number | boolean;
type 可记录 = {
log(): void;
};

type 可转换为字符串并记录 = 可转换为字符串 & 可记录;

function processValue(value: 可转换为字符串并记录) {
console.log(value.toString());
value.log();
}

// 让我们创建一个满足这种交叉的对象
const myValue: 可转换为字符串并记录 = {
valueOf() { return 42; },
log() { console.log("已记录！"); }
};

processValue(myValue);

在这里，我们组合了一个联合类型（可转换为字符串）和一个接口类型的类型（可记录）。结果可转换为字符串并记录类型必须既有转换为字符串的能力，也有一个log方法。

交叉类型是结合性和交换性的

现在，让我们讨论交叉类型的两个重要属性：结合性和交换性。别让这些大词吓到你——它们实际上是简单的概念！

结合性

结合性意味着在使用多个&操作符时，类型的组合顺序并不重要。换句话说：

type A = { a: string };
type B = { b: number };
type C = { c: boolean };

type ABC1 = A & (B & C);
type ABC2 = (A & B) & C;

// ABC1 和 ABC2 是等价的！

无论你是将A与(B & C)组合，还是将(A & B)与C组合，最终得到的结果都是相同的。这就像是说（1 + 2）+ 3 和 1 + （2 + 3）在数学中是相同的。

交换性

交换性意味着交叉中的类型顺序并不重要。例如：

type AB = A & B;
type BA = B & A;

// AB 和 BA 是等价的！

无论你写A & B还是B & A——你都会得到相同的组合类型。想想混合蓝色和黄色颜料——无论你是先加蓝色再加黄色，还是先加黄色再加蓝色，都会得到绿色。

交叉类型的实际应用

现在我们了解了基础知识，让我们看看一些交叉类型在实际场景中非常有用的例子：

1. 组合接口

interface 可打印 {
print(): void;
}

interface 可记录 {
log(): void;
}

type 可打印并记录 = 可打印 & 可记录;

class MyClass implements 可打印并记录 {
print() { console.log("打印中..."); }
log() { console.log("记录中..."); }
}

在这里，我们创建了一个新的类型，它组合了两个接口。任何可打印并记录类型的对象都必须实现print()和log()方法。

2. 向现有类型添加属性

type 用户 = {
id: number;
name: string;
};

type 带电子邮件的用户 = 用户 & { email: string };

const user: 带电子邮件的用户 = {
id: 1,
name: "约翰·多伊",
email: "[email protected]"
};

在这个示例中，我们通过交叉类型向用户类型添加了一个额外的email属性。

常见陷阱和提示

和任何强大的特性一样，在使用交叉类型时也有一些需要注意的事项：

属性冲突：如果你交叉具有相同名称但类型不同的属性的类型，TypeScript将尝试调和它们，这有时可能会导致意外的结果。
永远类型：如果你交叉不兼容的类型，可能会得到never类型，这表示一个永远不会发生的类型。
类型推断：TypeScript在推断类型方面非常聪明，但有时在使用复杂的交叉时，你可能需要显式地类型化你的变量。

结论

恭喜你！你刚刚迈出了进入TypeScript中交叉类型世界的第一步。我们已经涵盖了基础知识，看了一些示例，甚至探索了一些高级概念。记住，就像编程中的任何技能一样，掌握交叉类型需要练习。不要害怕在你的项目中尝试和尝试不同的组合。

在我们结束之前，这里有一个总结我们所讨论的关键方法的表格：

方法	描述
`&`	用于创建交叉类型的和号操作符
`type 新类型 = 类型A & 类型B`	创建交叉类型的基本语法
`implements`	当一个类实现一个交叉类型时使用的关键字

继续编码，继续学习，最重要的是，享受乐趣！TypeScript的类型系统是一个强大的工具，交叉类型只是使其如此多功能的众多特性之一。祝编码愉快，未来的TypeScript大师！

Credits: Image by storyset