TypeScript中函数组合方法（链）的类型推断

Question

我尝试实现一个函数，该函数将扩展指定函数以具有 function composition 的可链接方法；如下；

另见： TypeScript playground

{
  const F = <T, U>(f: (a: T) => U) => {
    type F = {
      compose: <V, >(g: (b: U) => V) => (((a: T) => V) & F);
    };
    return Object.defineProperty(f, "compose", {
      configurable: true,
      value: <V,>(g: (b: U) => V) => F((a: T) => g(f(a)))
    }) as ((a: T) => U) & F
  };
  //--------------------------------
  const f1 = (a: number) => a + 1;
  const f2 = (a: number) => a.toString();
  const identity = <T,>(a: T) => a;
  //--------------------------------
  const F2 = F(f2);
  // ((a: number) => string) & F  // good
  const F12 = F(f1).compose(f2);
  // ((a: number) => string) & F  // good
  //--------------------------------
  const F2i = (F2).compose(identity);
  // ((a: number) => string) & F  // good
  const f12i = (F12).compose(identity);
  // ((a: number) => number) & F  // bad  why??
  //--------------------------------
  const fi1 = F(identity).compose(f1);
  /* ts(2345) error
    Argument of type '(a: number) => number' is not assignable to parameter of type '(b: unknown) => number'.
        Types of parameters 'a' and 'b' are incompatible.
          Type 'unknown' is not assignable to type 'number'.
    const f1: (a: number) => number
  */
}

在这个示例代码中，我们有 3 个基本功能； f1、f2 和 identity。

F是一个函数，就是将一个指定的函数扩展成一个函数组合的方法。

我设法让它工作了；但是我发现至少有 2 个问题。

1.

现在，我们将F 用于f2，而F2 的类型是((a: number) => string) & F，这是意料之中的。

那么，我们用F代替f1，用f2组合，F12的类型也是((a: number) => string) & F，这是意料之中的。

因此，F2 和 F12 的类型是相同的，到目前为止，很好。

现在，(F2).compose(identity) 的类型应该是 ((a: number) => string) & F。

但是，(F12).compose(identity) 的类型是 ((a: number) => number) & F，这是意料之中的。

我已经跟踪我的代码很长时间了，但我不知道为什么会发生这种情况。

你能给我建议吗？谢谢！

编辑：

请注意函数不应该被包裹在Object中，我的意图是直接为函数提供一个compose方法：

 const f = (a: number) => a + 1;
  const fg = f.compose(g);

  //not
  {
    f: f,
      compose:someFunction
  }

---

编辑：对于第二个问题，@jcalz 的 cmets，我创建了单独的问题：

Is there any workaround for ts(2345) error for TypeScript lacks higher kinded types?

2.

如图所示，我有 ts(2345) 错误，错误消息对我来说没有意义，所以我不知道如何解决这个问题。

Answer 1

如果您检查 const F 的类型（值，而不是私人命名的类型）并将其展开一点，您遇到的问题应该很明显：

const alsoF: <T, U>(f: (a: T) => U) =>
  ((a: T) => U) & {
    compose: <V>(g: (b: U) => V) => (((a: T) => V) & {
      compose: <V>(g: (b: U) => V) => (((a: T) => V) & {
        compose: <V>(g: (b: U) => V) => (((a: T) => V) & {
          compose: <V>(g: (b: U) => V) => (((a: T) => V) & {
            compose: <V>(g: (b: U) => V) => (((a: T) => V) & any);
          });
        });
      });
    });
  } = F; // okay

（在深入了几层之后，我用any 退出了，但是如果您创建新的命名类型，则不需要这样做；不过，这对于本次讨论无关紧要。）如果您传递的函数到F 的类型为(a: T) => U 对于某些U，返回的函数有一个compose 方法接受一个回调，其第一个参数是U 类型。没关系，但是当您调用 compose 方法时，您的新事物的 compose 方法与旧方法的类型相同。它需要一个参数为U 类型的回调。但是您想要一个回调，其参数类型为V，即之前传递给compose() 的回调的返回类型。而且这个问题永远存在：每次调用compose() 都会返回另一个东西，它的compose() 期望回调接受U 类型的参数，而不是之前调用compose() 的返回类型。

这意味着您的F(f1) 返回以下类型：

const fF1 = alsoF(f1);
/* const alsoF12: ((a: number) => string) & {
compose: <V>(g: (b: number) => V) => ((a: number) => V) & {
    compose: <V>(g: (b: number) => V) => ((a: number) => V) & {
        ...;
    };
}; } */

因此，您的F12 属于以下类型：

const alsoF12 = alsoF(f1).compose(f2);
/* const alsoF12: ((a: number) => string) & {
compose: <V>(g: (b: number) => V) => ((a: number) => V) & {
    compose: <V>(g: (b: number) => V) => ((a: number) => V) & { ... };
};  } */

哎呀，它总是希望对compose() 的回调采用number，而不是您想要的string。所以你的f12i 是这样的：

const alsoF12i = (alsoF12).compose(identity);
/* const alsoF12i: ((a: number) => number) & {
compose: <V>(g: (b: number) => V) => ((a: number) => V) & {
    compose: <V>(g: (b: number) => V) => ((a: number) => V) & { ...  };
  }; } */

这不是你想要的。

---

要解决此问题，您将需要从 compose() 返回的类型来跟踪原始回调参数中的 T 类型和“当前”U 类型，这是最常见的返回类型最近传入的参数。所以你定义的F类型应该是U中的generic，以便表示这一点。让我们将其从函数实现中提取出来，并将F<T, U> 描述为调用F(f) 的结果，其中f 的类型为(a: T) => U：

interface F<T, U> {
  (a: T): U;
  compose<V>(g: (b: U) => V): F<T, V>;
}

所以它有一个call signature，它接受T 类型的值并返回U。它还有一个通用的compose 方法，它为通用V 接收一个(b: U) => V 类型的回调，并返回一个F<T, V>。正是这种将V 替换为U 的方法让链能够跟踪最近的回调返回类型。

下面是实现：

const F = <T, U>(f: (a: T) => U): F<T, U> => {
  return Object.defineProperty(f, "compose", {
    configurable: true,
    value: <V,>(g: (b: U) => V) => F((a: T) => g(f(a)))
  }) as any;
};

让我们试试吧：

const f1 = (a: number) => a + 1;
const f2 = (a: number) => a.toString();
const identity = <T,>(a: T) => a;
//--------------------------------
const F2 = F(f2);
// const F2: F<number, string> 
const F12 = F(f1).compose(f2);
// const F12: F<number, string>
//--------------------------------
const F2i = (F2).compose(identity);
// const F2i: F<number, string>
const f12i = (F12).compose(identity);
// const f12i: F<number, string>

console.log(f12i(123).repeat(2)) // "124124"

看起来不错。编译器现在知道f12i 是F<number, string> 类型，所以当你调用它时，它会返回一个string。

---

Playground link to code