泛型函数类型中的 Promise 结果值未知答案

【问题标题】：Promise result value is unknown in generic function type泛型函数类型中的 Promise 结果值未知
【发布时间】：2021-04-10 08:18:10
【问题描述】：

我正在尝试为返回 Promise 的函数键入通用装饰器/包装器函数。

我试过这段代码，但它在callFetch函数上返回Promise<unknown>，而我期望它返回Promise<{ param: string; userId: number }>，这是callAPI的返回类型。

const callAPI = (param: string, userId: number) => Promise.resolve({ param, userId });

function wrappedFunctions() {
  const userId = 1;
  // hypothetical refetch function
  const refetch = () => {};

  const wrapAction = <T extends (...args: any[]) => Promise<R>, R>(
    callback: T,
  ): ((...args: Parameters<T>) => Promise<R>) => async (...args: Parameters<T>) => {
    const response = await callback(...args);
    refetch();
    return response;
  };

  // returns Promise<unknown>
  // expect Promise<{ param: string; userId: number }>
  const callFetch = wrapAction((param: string) => callAPI(param, userId));

  return {
    callFetch,
  };
}

这是codesandbox。

【问题讨论】：

标签： typescript function generics promise async-await

【解决方案1】：

您的代码的问题是 R 模板变量依赖于 T 内容。

但在您的情况下，您可以拥有 2 个单独的模板变量，而不是扩展整个回调：一个用于 args，另一个用于返回值：

例子：

const wrapAction = <A extends unknown[], R>(
    callback: (...args: A) => Promise<R>,
): ((...args: A) => Promise<R>) => async (...args) => {
    const response = await callback(...args);
    refetch();
    return response;
};

const callFetch = wrapAction((param: string) => callAPI(param, userId));

A 模板变量将提取参数列表（例如[param: string]）和R 承诺返回类型（例如{ param: string; userId: number; }）。

【讨论】：