面试题：复杂场景下TypeScript泛型的代码复用

Question

假设你正在开发一个通用的数据处理库，需要实现一个函数 `transformArray`，它接受一个数组和多个转换函数。每个转换函数可以是不同类型的，并且对数组元素进行特定的转换。利用TypeScript泛型，实现 `transformArray` 函数，使得它在类型检查时能根据传入的转换函数准确推断出最终返回数组的类型。例如，传入一个 `number` 数组和一个将 `number` 转换为 `string` 的函数，最终返回 `string` 数组。同时，解释实现过程中如何巧妙利用TypeScript的类型推断和泛型约束来确保代码的健壮性和复用性。

Answer 1

function transformArray<T, U>(arr: T[], ...transformers: ((arg: T) => U)[]): U[] {
    return arr.map((element) => {
        return transformers.reduce((acc, transformer) => {
            return transformer(acc);
        }, element);
    });
}

实现过程解释

1. 泛型定义：
   • T 代表输入数组 arr 中元素的类型。
   • U 代表经过所有转换函数处理后，最终数组元素的类型。
2. 函数参数：
   • arr: T[] 明确输入参数 arr 是一个元素类型为 T 的数组。
   • ...transformers: ((arg: T) => U)[] 表示接受多个转换函数，这些函数接受类型为 T 的参数并返回类型为 U 的值。这里利用了TypeScript的剩余参数语法和函数类型定义。
3. 返回值类型：U[] 表示返回一个元素类型为 U 的数组。
4. 具体实现：
   • 使用 map 方法遍历输入数组 arr。对于每个元素，通过 reduce 方法依次调用传入的转换函数，将前一个函数的返回值作为下一个函数的参数，最终得到经过所有转换后的结果数组。
5. 类型推断和泛型约束：
   • 类型推断：TypeScript根据传入的数组类型和转换函数类型，自动推断出 T 和 U 的具体类型。例如，如果传入 number 数组和将 number 转换为 string 的函数，T 会被推断为 number，U 会被推断为 string，从而保证返回数组类型为 string[]。
   • 泛型约束：通过定义 transformers 的类型为 ((arg: T) => U)[]，约束了所有转换函数必须接受 T 类型参数并返回 U 类型值，确保了转换逻辑的一致性和类型安全性，增强了代码的健壮性和复用性。