TypeScript入门学习二 — 探索TypeScript 类型系统

2024-01-09 01:56:00

在上一篇文章中，我们了解了 TypeScript 是什么，以及 TypeScript 与 JavaScript 的特点。在这一篇中，我们将开始正式学习 TypeScript。首先，我们将从 TypeScript 的类型系统开始。

类型系统

类型系统是编程语言的重要组成部分。类型系统可以帮助我们捕获程序中的错误，提高程序的健壮性。TypeScript 的类型系统是静态的，这意味着 TypeScript 会在编译时对程序进行类型检查。如果 TypeScript 在编译时发现程序中存在类型错误，那么 TypeScript 就会报错，这样我们就可以在程序运行之前发现错误并进行修改。

类型注解

TypeScript 中的类型注解是一种可选的语法。类型注解可以帮助 TypeScript 更准确地理解程序中的类型。例如，我们可以使用类型注解来指定变量的类型。

let age: number = 20;

在这个例子中，我们使用类型注解指定变量 age 的类型是 number。这样 TypeScript 就知道变量 age 可以存储数值。

类型推断

TypeScript 还支持类型推断。类型推断是指 TypeScript 可以根据变量的值来推断变量的类型。例如，我们可以使用类型推断来指定变量 name 的类型。

let name = "John Doe";

在这个例子中，TypeScript 会根据变量 name 的值来推断出变量 name 的类型是 string。

类型检查

TypeScript 会在编译时对程序进行类型检查。如果 TypeScript 在编译时发现程序中存在类型错误，那么 TypeScript 就会报错。例如，如果我们尝试将一个字符串值赋给一个数字类型的变量，那么 TypeScript 就会报错。

let age: number = "20";

在这个例子中，TypeScript 会报错，提示我们不能将一个字符串值赋给一个数字类型的变量。

类型兼容性

TypeScript 中的类型兼容性是指一个类型的变量可以赋值给另一个类型。例如，一个数字类型的变量可以赋值给一个数字类型的变量。

let age: number = 20;
let years: number = age;

在这个例子中，我们首先声明了一个数字类型的变量 age，并给它赋值为 20。然后，我们又声明了一个数字类型的变量 years，并给它赋值为 age。这样 TypeScript 不会报错，因为 age 和 years 都是数字类型的变量，它们是类型兼容的。

类型别名

TypeScript 中的类型别名可以让我们给一种类型起一个新的名字。例如，我们可以使用类型别名来给数字类型起一个新的名字 Age。

type Age = number;

let age: Age = 20;

在这个例子中，我们首先使用 type 声明了一个类型别名 Age，并给它赋值为 number。然后，我们又声明了一个变量 age，并给它赋值为 20。这样 TypeScript 不会报错，因为 Age 和 number 是相同的类型。

接口

TypeScript 中的接口可以让我们定义一种类型的形状。例如，我们可以使用接口来定义一个 Person 类型。

interface Person {
  name: string;
  age: number;
}

let person: Person = {
  name: "John Doe",
  age: 20
};

在这个例子中，我们首先使用 interface 关键字声明了一个接口 Person。然后，我们又声明了一个变量 person，并给它赋值为一个对象。这个对象必须包含 name 和 age 两个属性，并且 name 的类型必须是字符串，age 的类型必须是数字。这样 TypeScript 不会报错，因为 person 符合 Person 接口的形状。

类

TypeScript 中的类可以让我们创建对象。例如，我们可以使用类来创建一个 Person 对象。

class Person {
  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

let person = new Person("John Doe", 20);

在这个例子中，我们首先使用 class 关键字声明了一个类 Person。然后，我们又声明了一个变量 person，并给它赋值为一个 Person 对象。这个 Person 对象包含两个属性，name 和 age。这样 TypeScript 不会报错，因为 person 是一个 Person 类的实例。

泛型

TypeScript 中的泛型可以让我们创建可重用的类型。例如，我们可以使用泛型来创建一个 List 类型。

class List<T> {
  private items: T[];

  constructor() {
    this.items = [];
  }

  add(item: T) {
    this.items.push(item);
  }

  get(index: number): T {
    return this.items[index];
  }
}

let list = new List<number>();
list.add(1);
list.add(2);
list.add(3);

console.log(list.get(0)); // 1
console.log(list.get(1)); // 2
console.log(list.get(2)); // 3