TypeScript 泛型及应用

泛型（Generics）是 TypeScript 中的一项强大特性，它允许我们在定义函数、类和接口时使用类型参数，从而增加代码的灵活性和重用性。本文将介绍 TypeScript 中泛型的概念、语法以及一些常见的应用场景。

泛型函数

在 TypeScript 中，我们可以使用泛型来定义函数。通过在函数名后面使用尖括号 <T> 来指定类型参数，并在函数参数或返回值中使用这个类型参数。例如：

function identity<T>(arg: T): T {return arg;
}let result = identity<string>("Hello");

在上面的例子中，我们定义了一个泛型函数 identity，它接受一个参数 arg，并返回相同类型的值。通过使用 <T>，我们可以在函数调用时指定参数的类型，从而实现类型安全的操作。

泛型类

除了函数，我们还可以使用泛型来定义类。通过在类名后面使用尖括号 <T> 来指定类型参数，并在类的属性、方法或构造函数中使用这个类型参数。例如：

class Box<T> {private value: T;constructor(value: T) {this.value = value;}getValue(): T {return this.value;}
}let box = new Box<number>(42);
console.log(box.getValue()); // 输出: 42

在上面的例子中，我们定义了一个泛型类 Box，它有一个私有属性 value 和一个公共方法 getValue。通过使用 <T>，我们可以在创建类的实例时指定属性的类型，并在方法的返回值中使用这个类型参数。

泛型接口

TypeScript 还支持泛型接口的定义。通过在接口名后面使用尖括号 <T> 来指定类型参数，并在接口的属性或方法中使用这个类型参数。例如：

interface List<T> {add(item: T): void;get(index: number): T;
}class MyList<T> implements List<T> {private items: T[] = [];add(item: T): void {this.items.push(item);}get(index: number): T {return this.items[index];}
}let myList = new MyList<number>();
myList.add(1);
myList.add(2);
console.log(myList.get(0)); // 输出: 1

在上面的例子中，我们定义了一个泛型接口 List，它有两个方法 add 和 get，分别用于添加元素和获取元素。通过使用 <T>，我们可以在实现接口时指定方法参数和返回值的类型。

泛型的应用场景

泛型在 TypeScript 中有许多应用场景，以下是一些常见的应用：

• 容器类：通过使用泛型，我们可以创建通用的容器类，如数组、链表、栈等，可以存储不同类型的数据。
• 函数工具：泛型可以用于编写通用的函数工具，如排序算法、过滤器、映射器等，可以处理不同类型的数据。
• Promise 和异步操作：通过使用泛型，我们可以创建通用的 Promise 类型，可以处理不同类型的异步操作。
• React 组件：在 React 中，我们可以使用泛型来定义通用的组件，可以接受不同类型的属性和状态。

总结

泛型是 TypeScript 中的一项强大特性，它允许我们在定义函数、类和接口时使用类型参数，从而增加代码的灵活性和重用性。通过泛型，我们可以创建通用的函数、类和接口，可以处理不同类型的数据，适用于各种应用场景。

希望本文对你理解 TypeScript 中泛型的概念和应用有所帮助！