如何输入咖喱“地图”？

Question

我正在尝试在 TypeScript 中键入一个 curried map 函数。这是等效的 JavaScript：

const double = n => n * 2;
const map = f => arr => arr.map(f);
const doubleArr = map(double);

console.log(doubleArr([1, 2, 3]));
// ↳ [2, 4, 6]

理想情况下，TypeScript 应该能够推断，在将 double 提供给 map 之后，doubleArray 接受一个数字数组并返回一个数字数组。

这是我尝试过的：

const double = (n: number) => n * 2;
const map = (f: Function) => (arr: Array<any>) => arr.map(f);

但是，TypeScript 在map 内部抱怨f：

Argument of type 'Function' is not assignable to parameter of type '(value: any, index: number, array: any[]) => unknown'.
  Type 'Function' provides no match for the signature '(value: any, index: number, array: any[]): unknown'.

你会如何在 TypeScript 中输入这个函数？

Answer 1

您可以使用以下声明：

const double = (n: number) => n * 2;
const map = <A, R>(f: (arg: A) => R) => (arr: A[]) => arr.map(f);
const doubleArr = map(double); // (arr: number[]) => number[]

console.log(doubleArr([1, 2, 3]));
// ↳ [2, 4, 6]

Playground sample

---

解释：A 和 R 是 generic type parameters。 map(double) 返回一个带有签名(arr: number[]) => number[] 的函数，因为TS 能够从double 分型中infer，所以A 和R 在这里都只能是number。

Answer 2

你可以声明一个接口然后传递它而不是Function

interface ArrFunction<T> {
    (n: T): T
}

const double = (n: number) => n * 2;
const map = (f: ArrFunction<any>) => (arr: Array<any>) => arr.map(f);

Answer 3

您可以使用两个参数创建一个函数map：数组和函数，以及何时要使用此函数，您应该将数组中的一个项目提供给此函数。

const double = (n: number) => n * 2;
const map = (arr: Array<any>, f: Function) => arr.map((item: any) => f(item));
map([1, 2, 3], double)