TypeScript 泛型示例

TypeScript 泛型是一项强大的功能，可让您创建可重用且类型安全的组件。泛型提供了一种创建类、函数和接口的方法，这些类、函数和接口可与多种类型配合使用，同时保持强类型安全性。本文将向您介绍泛型，并通过实际示例演示如何使用它们。

理解泛型

泛型可让您使用占位符来定义组件，以表示其所操作的类型。您无需指定具体类型，而是使用泛型类型参数，在使用该组件时，该参数可以替换为任何类型。

基本语法

定义泛型类型的基本语法是使用尖括号 <> 和类型参数名称。以下是一个简单的示例：

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

const stringIdentity = identity("Hello"); // string
const numberIdentity = identity(123); // number

在此示例中，identity 是一个泛型函数，它接受类型为 T 的参数 value，并返回相同类型的值。调用该函数时，类型参数 T 将被替换为实际类型。

泛型与类

泛型还可以与类一起使用，以创建灵活且可重用的数据结构。以下是泛型类的示例：

class Box {
  private value: T;

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

  getValue(): T {
    return this.value;
  }
}

const stringBox = new Box("TypeScript");
console.log(stringBox.getValue()); // Output: TypeScript

const numberBox = new Box(42);
console.log(numberBox.getValue()); // Output: 42

在此示例中，Box 类使用泛型类型参数 T 进行定义。该类具有类型 T 的私有属性 value 以及返回类型 T 的值的方法 getValue。

带接口的泛型

泛型可以与接口一起使用，以创建灵活且类型安全的接口。以下是示例：

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

const pair: Pair<string, number> = {
  first: "Age",
  second: 30
};

console.log(pair.first); // Output: Age
console.log(pair.second); // Output: 30

在此示例中，Pair 接口定义有两个泛型类型参数 T 和 U。该接口表示一对值，类型分别为 T 和 U。

函数中的泛型

泛型可用于函数中，以处理多种类型，同时保持类型安全。以下是处理数组的泛型函数示例：

function reverseArray(items: T[]): T[] {
  return items.reverse();
}

const reversedStringArray = reverseArray(["one", "two", "three"]);
console.log(reversedStringArray); // Output: ["three", "two", "one"]

const reversedNumberArray = reverseArray([1, 2, 3]);
console.log(reversedNumberArray); // Output: [3, 2, 1]

在此示例中，reverseArray 函数接受类型为 T 的数组并返回相同类型的反向数组。类型参数 T 确保该函数可处理任何类型的数组，同时保持类型安全。

泛型的限制

有时可能需要对泛型类型参数施加约束，以确保其具有某些属性。这可以通过使用约束来实现：

function logLength(item: T): void {
  console.log(item.length);
}

logLength("Hello, TypeScript"); // Output: 16
logLength([1, 2, 3]); // Output: 3
// logLength(123); // Error: number does not have a length property

在此示例中，logLength 函数被限制为具有 length 属性的类型。这允许该函数接受字符串和数组，但不能接受数字或不具有 length 属性的其他类型。

结论

TypeScript 中的泛型提供了一种强大的方法来创建灵活且可重用的组件，同时保持强大的类型安全性。通过理解和利用泛型，您可以编写更通用、适应性更强的代码，从而提高 TypeScript 应用程序的整体质量和可维护性。

在您的项目中尝试使用泛型来了解它们的实际优势并增强您的 TypeScript 编程技能。