TypeScript：如何正确键入一个接受承诺并按原样返回该承诺的函数答案

【问题标题】：TypeScript: How can I properly type a function that takes a promise and returns that promise as it isTypeScript：如何正确键入一个接受承诺并按原样返回该承诺的函数
【发布时间】：2023-03-04 05:53:02
【问题描述】：

我有一个名为 prepareOnTick 的函数，它返回一个函数，该函数接受一个承诺并在承诺的 then catch finally 回调中添加一些逻辑。

const prepareOnTick = (onPerItemSettle: OnPerItemSettle) => {
  return (promise: Promise<any>) => {
    promise
      .then(
        () => {
          onPerItemSettle.onSuccess?.();
        },
        () => {
          onPerItemSettle.onError?.();
        }
      )
      .finally(() => {
        onPerItemSettle.onSettled?.();
      });

    return promise;
  };
};

const onTick = prepareOnTick({...})

我希望onTick 的类型能够反映这样一个事实，即无论它需要什么承诺，它都会按原样返回。但是现在它的类型是(promise: Promise<any>) => Promise<any>，这不太准确。我想应该是 (promise: Promise<T>) => Promise<T>。

所以我试着这样输入

const prepareOnTick = (onPerItemSettle: OnPerItemSettle) => {
  return <T>(promise: Promise<T>):  Promise<T>=> {
    promise
      .then(
        () => {
          onPerItemSettle.onSuccess?.();
        },
        () => {
          onPerItemSettle.onError?.();
        }
      )
      .finally(() => {
        onPerItemSettle.onSettled?.();
      });

    return promise;
  };
};

但是 TS 编译器显然不喜欢我的类型注释，所以我一定做错了什么。这是demo 有人可以看看吗？

【问题讨论】：

这是一件相当奇怪的事情；形成一个没有终端错误处理并且没有链接到它的私有分支。

标签： javascript typescript promise

【解决方案1】：

您忘记在泛型参数后添加额外的逗号，这里：return <T,>

const prepareOnTick = (onPerItemSettle: OnPerItemSettle) => {
  // TS compiler does not like <T>, he likes more <T,> or <T extends unknown> because of 
  // JSX :D
  return <T,>(promise: Promise<T>):  Promise<T>=> {
    promise
      .then(
        () => {
          onPerItemSettle.onSuccess?.();
        },
        () => {
          onPerItemSettle.onError?.();
        }
      )
      .finally(() => {
        onPerItemSettle.onSettled?.();
      });

    return promise;
  };
};

你应该看看这个question

【讨论】：