TypeScript可变参异步函数包装器返回类型异常求助

问题分析 #

为什么第一个实现返回Promise<any>？

你给泛型F设置的约束是(...args: any[]) => Promise<any>，这相当于强制TypeScript把传入的process函数的返回类型统一视为Promise<any>——哪怕实际传入的函数返回Promise<boolean>，这个约束也会覆盖具体类型，导致类型信息丢失，最终返回Promise<any>。

为什么第二个实现返回Promise<unknown>？

泛型参数的推断顺序是从前到后的，你把R放在F前面，TypeScript需要先确定R的类型，但R依赖于F的返回值，此时F还没完成推断，所以TypeScript只能默认把R推断为unknown，最终返回Promise<unknown>。

优雅的解决方案 #

我们可以用两个泛型参数分别捕获函数的参数类型和返回值类型，让TypeScript自动完成推断，无需额外的约束限制：

export const wrapLoading = <Args extends any[], R>(
  process: (...args: Args) => Promise<R>
) => {
  return async (...args: Args) => {
    isLoading.value = true;
    const result = await process(...args);
    isLoading.value = false;
    return result;
  };
};

如果偏好用F表示整个函数类型，也可以通过ReturnType<F>提取返回类型，同时弱化约束的限制：

export const wrapLoading = <F extends (...args: any[]) => Promise<unknown>>(
  process: F
) => {
  return async (...args: Parameters<F>): ReturnType<F> => {
    isLoading.value = true;
    const result = await process(...args);
    isLoading.value = false;
    return result as ReturnType<F>;
  };
};

用你的示例代码测试，两种写法都能让submit的类型被正确推断为(values: string[]) => Promise<boolean>，完全符合需求。

内容的提问来源于stack exchange，提问作者Brunni