TypeScript 类、泛型的使用 | 豆包MarsCode AI刷题

115 阅读4分钟

在 TypeScript 中,泛型(Generics)是一个强大的工具,它使得我们能够编写具有更高重用性、灵活性以及类型安全的代码。泛型允许我们在定义函数、类或接口时,不预先指定具体的类型,而是通过类型参数来替代。这使得代码可以在不同的类型间进行复用,同时仍然保持类型安全。

一、泛型的基础

首先,我们来看看最基础的泛型定义和使用方式。

1. 泛型函数

一个简单的泛型函数示例:

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

let num = identity(42);         // num 的类型是 number
let str = identity("hello");     // str 的类型是 string

在这个例子中,identity 函数接受一个泛型参数 T,该参数类型会根据调用时传入的参数类型来推导。也可以显式指定泛型类型:

let num = identity<number>(42);  // 显式指定类型

2. 泛型数组

泛型同样适用于数组类型,我们可以使用它来定义一个类型安全的数组:

function logArray<T>(arr: T[]): void {
  arr.forEach(item => console.log(item));
}

logArray([1, 2, 3]);         // 数字数组
logArray(['a', 'b', 'c']);   // 字符串数组

二、泛型类

泛型不仅可以用于函数,也可以用于类。泛型类使得我们可以创建灵活且可复用的类,适用于各种不同类型的数据。

1. 泛型类示例

class Box<T> {
  value: T;
  
  constructor(value: T) {
    this.value = value;
  }
  
  getValue(): T {
    return this.value;
  }
}

const box1 = new Box<number>(42);  // 类型为 number
console.log(box1.getValue());      // 42

const box2 = new Box<string>("Hello, world!");  // 类型为 string
console.log(box2.getValue());  // Hello, world!

在这个示例中,Box 类是一个泛型类,T 是一个类型变量,可以是任何类型。在创建 Box 实例时,我们通过传入类型参数来确定 T 的实际类型。

三、泛型接口

泛型不仅可以应用于函数和类,还可以用于接口,接口中的泛型可以使得代码更加灵活。

1. 泛型接口示例

interface Pair<T, U> {
  first: T;
  second: U;
}

let pair: Pair<string, number> = {
  first: 'hello',
  second: 42
};

在这个例子中,Pair 是一个泛型接口,接受两个类型参数 TU,使得我们可以创建包含两个不同类型数据的对象。

四、泛型约束

为了使泛型更加类型安全,我们可以使用类型约束来限定泛型参数的类型。这通常用于希望泛型能够遵循某些特定的结构或实现某些接口的场景。

1. 泛型约束示例

interface LengthWise {
  length: number;
}

function logLength<T extends LengthWise>(value: T): void {
  console.log(value.length);
}

logLength("Hello, world!");  // string 类型具有 length 属性
logLength([1, 2, 3]);         // 数组类型也有 length 属性

在这个示例中,T extends LengthWise 是对泛型 T 的类型约束,要求传入的类型 T 必须具有 length 属性。这样,如果我们尝试传入没有 length 属性的类型,将会导致类型错误:

logLength(42);  // 错误:number 类型没有 length 属性

五、多个泛型参数

在 TypeScript 中,泛型可以接受多个类型参数,这使得它能够支持更复杂的数据结构和函数签名。

1. 多个泛型参数示例

class Duo<T, U> {
  first: T;
  second: U;
  
  constructor(first: T, second: U) {
    this.first = first;
    this.second = second;
  }
}

let duo = new Duo<number, string>(42, "hello");

在这个例子中,Duo 类接受两个泛型参数 TU,分别代表两个不同类型的成员变量。创建实例时,我们指定了这两个类型的具体值。

六、泛型与继承

泛型可以与继承结合使用,限制泛型的类型为某一父类或实现某一接口的类型。这对于创建可扩展和可重用的代码非常有帮助。

1. 泛型与继承示例

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

class Dog extends Animal {
  bark() {
    console.log("Woof!");
  }
}

class AnimalBox<T extends Animal> {
  animal: T;

  constructor(animal: T) {
    this.animal = animal;
  }

  getAnimalName(): string {
    return this.animal.name;
  }
}

const dogBox = new AnimalBox(new Dog("Buddy"));
console.log(dogBox.getAnimalName()); // Buddy

在这个例子中,AnimalBox 是一个泛型类,T 被约束为继承自 Animal 类。这样,T 类型的实例不仅能够使用 Animal 类的属性和方法,还能够扩展更多的功能。

七、常见泛型应用场景

  1. 集合类库:泛型常用于定义数据结构(如栈、队列、链表等)和集合类库(如 Set、Map 等)。它们通常处理的数据类型不确定,但需要保证操作的数据类型安全。
  2. 函数式编程:在函数式编程中,泛型使得函数能够处理多种类型的数据(如高阶函数、map、filter、reduce 等)。
  3. 异步编程:泛型常用于处理异步操作,特别是与 Promise、async/await 相关的类型定义。
  4. 类型推导与自动化测试:泛型可以帮助自动推导函数、类或组件的类型,减少手动类型注释,提高代码的自动化和测试覆盖率。

总结

通过合理使用泛型,TypeScript 能够提升代码的灵活性和类型安全性。我们可以通过泛型函数、类、接口以及类型约束来创建更加通用且类型安全的代码。掌握泛型的应用将大大提升开发效率,减少潜在的类型错误,并使代码更具可维护性和可扩展性。