异步函数内的回调异步函数！是正确的？答案

【问题标题】：Callback Async function inside async function ! Is correct?异步函数内的回调异步函数！是正确的？
【发布时间】：2021-02-20 14:59:35
【问题描述】：

我希望这个重用异步函数可以在很多地方使用！

const requestGetData = (callback?: Function): void => {
      (async (): Promise<void> => {
        try {
          if (callback) {
            await callback();
          }
          const data = await getDataApi();
          setData(data);
        } catch (error) {
          console.log(error)
        }
      })();
  };

我有不同的异步功能：

  const requestUpdateData = async (): Promise<void> => {
      await postUpdate();
      setCountUpdate(count+1);
    };

我会用：

...
const handleUpdate=()=>{
  requestGetData(requestUpdateData);
}

useEffect(()=>{
  requestGetData()
},[])

我自定义 async 是否正确？有没有更好的办法？我要重用函数 requestGetData

【问题讨论】：

标签： javascript reactjs typescript axios react-hooks

【解决方案1】：

无需将其包装在 IIFE 中，也无需注意 TS 可以自动推断的函数类型。另外，比起Function，最好使用更具体的类型，比如() => void。

考虑以下内容：

const requestGetData = async (callback?: () => void) => {
    try {
        if (callback) {
            await callback();
        }
        setData(await getDataApi());
    } catch (error) {
        console.log(error);
    }
};

另一种选择是完全删除回调，并让调用者将.then 链接到requestUpdateData 调用：

const requestGetData = () => {
    return getDataApi().then(setData);
};
requestUpdateData()
    .then(requestGetData)
    .catch((error) => {
        console.log(error);
    });

如上，requestGetData 在没有捕获的情况下返回其 Promise 链，但如果应用程序中的其他任何内容在遇到错误时不需要特殊逻辑，您可以在其中捕获。

【讨论】：

【解决方案2】：

考虑到当你调用函数时，你用await 调用它，这意味着你总是期望回调函数是异步的。我建议将回调参数的类型声明更新为() => Promise<any>，但我不明白为什么这需要成为 IIFE。否则，我觉得很好。

【讨论】：