TypeScript 作为 JavaScript 的一个超集,拥有强大的类型系统,这可以帮助开发者编写更加健壮、可维护的代码。本文将从 TypeScript 的基础类型开始,逐步深入到复杂泛型的使用,并提供实用的实践技巧,帮助你更好地掌握 TypeScript 类型系统,从而提升代码质量。

一、TypeScript 基础类型

TypeScript 提供了丰富的基础类型,包括:

1. 布尔型(Boolean)

let isDone: boolean = false;

2. 数字型(Number)

let count: number = 10;

3. 字符串型(String)

let message: string = "Hello, TypeScript!";

4. 字符型(Character)

let ch: char = 'a';

5. 任意类型(Any)

let notSure: any = 4;
notSure = "maybe a string instead";

6. 数组类型

let list: number[] = [1, 2, 3];
let list2: Array<number> = [1, 2, 3];

7. 元组类型(Tuple)

let x: [string, number];
x = ["hello", 10]; // OK
x = [10, "hello"]; // Error

8. 枚举(Enum)

enum Color { Red, Green, Blue };
let c: Color = Color.Green;

9. void 类型

function sayHello(): void {
  console.log("Hello");
}

10. null 和 undefined

let u: undefined = undefined;
let n: null = null;

二、接口(Interface)

接口定义了类的结构,包括类的属性和方法,但不包含具体的实现。

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

function greet(person: Person): void {
  console.log(`Hello, ${person.name}!`);
}

三、类(Class)

TypeScript 支持面向对象编程,类是面向对象的基本单位。

class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

let a: Animal = new Animal("dog");

四、泛型(Generic)

泛型允许在定义函数、接口和类的时候不指定具体的类型,而是在使用的时候再指定。

1. 泛型函数

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

2. 泛型接口

interface GenericIdentityFn<T> {
  <U>(arg: U): T;
}

function identityFn<T, U>(arg: U): T {
  return arg;
}

3. 泛型类

class GenericNumber<T> {
  zeroValue: T;
  add: (x: T, y: T) => T;
}

let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };

五、高级泛型

1. 高阶泛型

高阶泛型指的是泛型本身是泛型的类型。

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

function logIdentity<T>(arg: T): T {
  console.log(arg);
  return arg;
}

// 高阶泛型函数
function identityFn<T, U>(arg: U): T {
  return arg;
}

2. 可变泛型

可变泛型允许在泛型类型中使用索引访问操作符([key: number])。

interface GenericArray<T> {
  [index: number]: T;
}

3. 约束泛型

约束泛型可以限制泛型参数的类型。

function identity<T extends number | string>(arg: T): T {
  return arg;
}

4. 空泛型

空泛型允许在泛型参数中使用空对象({})。

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

六、总结

TypeScript 的类型系统可以帮助开发者编写更加健壮、可维护的代码。通过本文的学习,你应该已经掌握了 TypeScript 的基础类型、接口、类、泛型等概念,并能够将这些知识应用到实际项目中。不断实践和探索,相信你会成为一名 TypeScript 高手。