TypeScript作为一种JavaScript的超集，引入了静态类型系统，为开发者提供了更强的类型检查和更好的开发体验。本文将带你从TypeScript的类型系统基础开始，逐步深入到进阶使用，帮助你轻松构建高效代码架构。

一、TypeScript类型系统基础

1. 基本类型

TypeScript支持多种基本数据类型，包括：

  • 数字（number）：表示数值类型。
  • 字符串（string）：表示文本类型。
  • 布尔值（boolean）：表示真或假。
  • null和undefined：表示变量未定义或未赋值。
let age: number = 25;
let name: string = '张三';
let isStudent: boolean = true;
let car: null = null;
let food: undefined = undefined;

2. 对象类型

TypeScript中的对象类型主要分为两类：普通对象和类。

  • 普通对象：使用 {} 定义，可以指定每个属性的名称和类型。
let person: { name: string; age: number } = { name: '李四', age: 30 };
  • 类：使用 class 关键字定义，可以包含属性和方法。
class Person {
  name: string;
  age: number;

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

  sayHello() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

3. 数组类型

TypeScript支持多种数组类型，包括：

  • 泛型数组：使用 <T> 语法定义，可以指定数组元素的类型。
let numbers: number[] = [1, 2, 3, 4, 5];
  • 数组类型断言：在数组后面加上类型，如 let numbers: Array<number> = [1, 2, 3, 4, 5];

4. 函数类型

TypeScript中的函数类型由参数类型和返回类型组成。

function add(a: number, b: number): number {
  return a + b;
}

二、TypeScript类型系统进阶

1. 高级类型

TypeScript提供了多种高级类型，包括：

  • 联合类型：使用 | 连接多个类型，表示变量可以是多个类型中的任意一个。
let result: string | number = 'hello' | 123;
  • 交叉类型：使用 & 连接多个类型，表示变量同时具有多个类型的属性。
interface Person {
  name: string;
  age: number;
}

interface Student {
  school: string;
}

let tom: Person & Student = { name: 'Tom', age: 18, school: '北京大学' };
  • 索引签名：用于定义一个索引的类型。
let obj: { [key: string]: number };
obj['name'] = 1;

2. 类型别名和接口

  • 类型别名：使用 type 关键字定义，可以简化代码。
type PersonType = { name: string; age: number };
  • 接口：用于定义对象的形状，可以包含属性和方法。
interface Person {
  name: string;
  age: number;
}

3. 泛型

泛型允许你在定义函数、接口和类时，不指定具体的类型，而是使用类型变量来代替。

function identity<T>(arg: T): T {
  return arg;
}

三、总结

通过学习TypeScript类型系统，你可以更好地组织代码，提高代码的可读性和可维护性。从基础类型到高级类型，TypeScript的类型系统为开发者提供了丰富的工具，帮助你轻松构建高效代码架构。希望本文能帮助你更好地掌握TypeScript类型系统，提高你的编程技能。