跳到主要内容

TypeScript 泛型函数

介绍​

在TypeScript中，泛型（Generics）是一种强大的工具，它允许我们编写灵活且可重用的代码。泛型函数是泛型的一种常见应用，它允许我们创建可以处理多种类型数据的函数，而不需要为每种类型编写单独的函数。

泛型函数的核心思想是：在定义函数时，我们不指定具体的类型，而是使用一个类型参数（通常用 T 表示），在调用函数时再指定具体的类型。这样，函数就可以适用于多种类型，而不需要重复编写代码。

基本语法​

泛型函数的基本语法如下：

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

在这个例子中，identity 是一个泛型函数。<T> 表示这是一个泛型函数，T 是一个类型参数。arg: T 表示函数的参数类型是 T，返回值类型也是 T。

调用泛型函数​

我们可以通过以下方式调用泛型函数：

typescript
let output1 = identity<string>("Hello");
let output2 = identity<number>(42);

在这个例子中，output1 的类型是 string，output2 的类型是 number。TypeScript会根据我们传入的参数类型自动推断出 T 的类型。

泛型函数的优势​

泛型函数的主要优势在于它的灵活性和可重用性。通过使用泛型，我们可以编写一个函数来处理多种类型的数据，而不需要为每种类型编写单独的函数。这不仅减少了代码的重复，还提高了代码的可维护性。

实际案例​

案例1：数组反转​

假设我们需要编写一个函数来反转数组。我们可以使用泛型来编写一个适用于任何类型数组的函数：

typescript
function reverseArray<T>(array: T[]): T[] {
    return array.reverse();
}

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = reverseArray(numbers); // [5, 4, 3, 2, 1]

let strings = ["a", "b", "c"];
let reversedStrings = reverseArray(strings); // ["c", "b", "a"]

在这个例子中，reverseArray 函数可以处理任何类型的数组，无论是数字数组还是字符串数组。

案例2：查找数组中的最大值​

假设我们需要编写一个函数来查找数组中的最大值。我们可以使用泛型来编写一个适用于任何类型数组的函数：

typescript
function findMax<T>(array: T[], compare: (a: T, b: T) => number): T {
    return array.reduce((max, current) => compare(max, current) > 0 ? max : current);
}

let numbers = [1, 2, 3, 4, 5];
let maxNumber = findMax(numbers, (a, b) => a - b); // 5

let strings = ["apple", "banana", "cherry"];
let maxString = findMax(strings, (a, b) => a.length - b.length); // "banana"

在这个例子中，findMax 函数可以处理任何类型的数组，并且通过传入一个比较函数来确定最大值。

总结​

泛型函数是TypeScript中非常强大的工具，它允许我们编写灵活且可重用的代码。通过使用泛型，我们可以避免重复编写类似的函数，从而提高代码的可维护性和可读性。

在实际开发中，泛型函数可以应用于各种场景，如数组操作、数据处理等。掌握泛型函数的使用，将有助于你编写更加高效和灵活的TypeScript代码。

附加资源​

练习​

  1. 编写一个泛型函数 mergeArrays，它接受两个数组并返回一个合并后的数组。
  2. 编写一个泛型函数 filterArray，它接受一个数组和一个过滤函数，并返回过滤后的数组。
  3. 编写一个泛型函数 mapArray，它接受一个数组和一个映射函数，并返回映射后的数组。

通过这些练习，你将进一步掌握泛型函数的使用，并能够在实际项目中灵活应用。