TypeScript 类型系统层级：从 Top Type 到 Bottom Type-TypeScript入门指南

当前位置:　首页>> 技术小册>> TypeScript入门指南

TypeScript的类型系统由多个层级组成，从最顶层的Top Type到最底层的Bottom Type，本章节将详细介绍每个层级的特点和示例。

-------------------------

**1、Top Type**

在TypeScript中，所有类型都是某个类型的子类型，唯一的例外是Top Type。Top Type表示任意类型，可以赋值给任意类型的变量。由于Top Type表示任意类型，所以它是类型层级中最高的一层。

```javascript
let x: any = 1;
x = 'hello';
x = { foo: 'bar' };

```

在上面的代码中，我们声明了一个变量x，它的类型是any，因为any是Top Type，所以我们可以将任何类型的值赋给它。

虽然any类型可以让我们在代码中灵活地使用任何类型的值，但也会带来潜在的类型错误和不安全性。因此，我们应该尽可能地避免使用any类型，而是尽可能地使用更具体的类型来增强代码的可读性和可维护性。

**2、Unknown Type**

除了Top Type，TypeScript还引入了一个特殊的类型unknown，它表示未知类型。unknown类型的变量只能赋值给unknown或any类型的变量，不能直接赋值给其他类型的变量，需要进行类型检查后才能使用。

```javascript
let x: unknown = 1;
let y: string;

// 编译错误：不能将类型“unknown”分配给类型“string”。
y = x;

if (typeof x === 'string') {
  y = x;
}

```

在上面的代码中，我们声明了一个变量x，它的类型是unknown，因为unknown类型是未知类型，所以我们不能将它直接赋值给string类型的变量y，需要进行类型检查后才能使用。

unknown类型的主要作用是在编写类型不确定的代码时提供更好的类型安全。例如，当我们从外部库中获取数据时，这些数据的类型可能是未知的，我们可以使用unknown类型来表示这些数据，并在使用前进行类型检查，避免类型错误和安全问题。

**3、Void Type**

void类型表示没有返回值的函数，它的变量只能赋值为undefined或null。通常，我们可以将void类型作为函数返回值的类型来表示函数没有返回值。

```javascript
function foo(): void {
  console.log('Hello, TypeScript!');
}

let x: void = undefined;
let y: void = null;

```

在上面的代码中，我们声明了一个没有返回值的函数foo，它的返回值类型是void，因为函数没有返回值。我们还声明了两个变量x和y，它们的类型都是void，只能赋值为undefined或null。

**4、Never Type**

never类型表示不会有任何值的类型。它通常用于表示那些总是会抛出异常或永远不会结束的函数。在实际开发中，我们很少直接将变量的类型设置为never，但在某些情况下，它可以帮助我们更准确地描述代码的行为。

```javascript
function throwError(message: string): never {
  throw new Error(message);
}

function infiniteLoop(): never {
  while (true) {}
}

let x: never = throwError('Something went wrong');
let y: never = infiniteLoop();

```

在上面的代码中，我们声明了两个函数throwError和infiniteLoop，它们的返回值类型都是never。throwError函数总是会抛出异常，因此永远不会返回任何值，infiniteLoop函数永远不会结束，因此也不会返回任何值。

我们还声明了两个变量x和y，它们的类型都是never，分别赋值为throwError和infiniteLoop函数的返回值。由于这些函数永远不会返回任何值，因此变量x和y的类型都是never。

**5、Object Type**

object类型表示非原始类型的值，即除number、string、boolean、symbol和null以外的所有类型。在TypeScript中，除了原始类型外的所有类型都被认为是object类型，包括数组、对象、函数等。

```javascript
let x: object = {};
let y: object = [];
let z: object = () => {};

```

在上面的代码中，我们声明了三个变量x、y和z，它们的类型都是object。变量x的值是一个空对象，变量y的值是一个空数组，变量z的值是一个空函数。

object类型是一个非常宽泛的类型，不够具体，不能提供足够的类型安全。因此，我们在实际开发中应该尽可能地使用更具体的类型来增强代码的可读性和可维护性。

**6、Union Type**

union类型表示可以取多种类型值的类型。我们可以使用|符号将多个类型组合成一个union类型，表示该类型可以取这些类型中的任意一种。

```javascript
let x: string | number = 'hello';
x = 123;

```

在上面的代码中，我们声明了一个变量x，它的类型是string | number，表示它可以取string或number类型的值。首先，我们将一个字符串赋值给变量x，然后将一个数字赋值给变量x，由于变量x的类型是string | number，因此时的变量x的类型为number，所以不能再将一个字符串赋值给它，否则会报错。

union类型是非常灵活的，可以用于表示多个可能的类型。在实际开发中，我们经常会遇到这种情况，例如一个函数可以接收多种类型的参数，我们就可以使用union类型来描述它的参数类型。

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

printId('abc');
printId(123);

```

在上面的代码中，我们定义了一个函数printId，它接收一个参数id，类型为string | number，表示它可以接收字符串或数字类型的参数。我们调用了两次printId函数，分别传入一个字符串和一个数字，由于参数的类型都是string | number，所以printId函数可以接受这些参数，并正确打印输出。

**7、Intersection Type**

intersection类型表示多个类型的交集。我们可以使用&符号将多个类型组合成一个intersection类型，表示该类型必须同时满足这些类型的要求。

```javascript
interface A {
  a: string;
}

interface B {
  b: number;
}

type C = A & B;

let c: C = {
  a: 'hello',
  b: 123
};

```

在上面的代码中，我们定义了两个接口A和B，分别表示拥有字符串属性a和数字属性b的对象类型。然后，我们使用&符号将它们组合成一个intersection类型C，表示一个既拥有属性a，又拥有属性b的对象类型。最后，我们声明了一个变量c，它的类型是C，也就是一个既拥有属性a，又拥有属性b的对象，然后将一个对象赋值给它。

intersection类型可以用于组合多个类型，使其具有更强的表达能力，同时也能提供更多的类型检查和类型推断。在实际开发中，我们可以使用intersection类型来描述一个对象类型既具有某些属性，又具有其他属性的情况。

**8、Type Alias**

type别名是用来给一个类型起一个新的名称，以便更好地表示代码的意图。我们可以使用type关键字来定义一个type别名。

```javascript
type Id = string | number;

function printId(id: Id) {
  console.log(`ID is: ${id}`);
}

printId('abc');
printId(123);

```

在上面的代码中，我们使用type关键字定义了一个type别名Id，它表示字符串或数字类型的值。然后，我们定义了一个函数printId，它接收一个参数id，类型为Id，表示它可以接收字符串或数字类型的参数。我们调用了两次printId函数，分别传入一个字符串和一个数字，由于参数的类型都是Id，也就是字符串或数字类型，所以printId函数可以接受这些参数，并正确打印输出。

使用type别名可以让我们的代码更加清晰和易读，尤其是在描述复杂的类型时，使用别名可以提高代码的可读性和可维护性。

**9、Type Assertion**

type assertion，也称为类型断言，是一种手动指定变量类型的方法，它可以告诉编译器变量的确切类型，从而绕过类型检查。在使用类型断言时，我们使用as关键字来指定变量的类型。

```javascript
let x: unknown = 'hello world';
let s: string = (x as string).toUpperCase();
console.log(s); // "HELLO WORLD"

```

在上面的代码中，我们声明了一个变量x，类型为unknown，也就是未知类型。然后，我们将一个字符串赋值给它，并使用类型断言将其转换为字符串类型。最后，我们调用字符串的toUpperCase方法，将字符串中的所有字符转换为大写字母，并将结果赋值给一个字符串变量s，最终输出结果为HELLO WORLD。

使用类型断言时需要注意，如果我们错误地指定了变量的类型，可能会导致运行时错误。因此，在使用类型断言时，我们应该尽可能避免手动指定变量类型，而是让 TypeScript 的类型系统自动推断变量类型。

**10、Bottom Type**

bottom类型是 TypeScript 类型系统中最底层的类型，它表示不包含任何值的类型。bottom类型通常用于表示不可能发生的情况，例如函数永远不会返回或抛出错误。

```javascript
function error(message: string): never {
  throw new Error(message);
}

let x: never = error('something went wrong');

```

在上面的代码中，我们定义了一个函数error，它接收一个字符串参数message，并抛出一个Error错误，表示出现了无法处理的异常情况。由于该函数永远不会返回，因此它的返回类型为never。然后，我们声明了一个变量x，类型为never，并将函数error的返回值赋值给它。

使用never类型可以帮助我们在代码中更好地表示出现异常情况的可能性，从而提高代码的可靠性和稳定性。

**小结**
本章节介绍了 TypeScript 类型系统中的各种类型，从最顶层的any类型到最底层的bottom类型，以及中间的基本类型、对象类型、函数类型、union类型、intersection类型和type别名等。通过学习这些类型，我们可以更好地理解 TypeScript 的类型系统，从而写出更加健壮、可靠的 TypeScript代码。

TypeScript 的类型系统是其最重要的特性之一，它可以帮助我们在开发过程中捕获错误、提高代码的可读性和可维护性，从而减少代码出错的可能性，加快开发效率。在实际的项目中，我们应该充分利用 TypeScript 的类型系统，编写出更加健壮、可靠的代码，从而提高项目的质量和稳定性。

该分类下的相关小册推荐：

TypeScript 全面进阶指南

TypeScript开发实战

剑指TypeScript