如何初始化最终将设置为 Typescript 中异步请求响应的变量？

Question

作为打字稿的新手，我遇到了一个我在第一个项目中没有遇到的问题——声明变量时事先的对于 try-catch 中的 api 请求，似乎会针对此变量的操作抛出打字稿错误后尝试捕捉。

我已经编写了示例代码来显示下面的问题。

res 是有问题的变量，在 if 语句的顶部。

  interface AuthApiData {
      message: string;
      success: boolean;
    }

    interface AuthApiRes {
      status: number;
      data: AuthApiData;
    }

    if (router.pathname !== '/login') {
      let res: AuthApiRes;
      
      let status;
      const authenticate = async () => {
        try {
          res = await axiosPrivate.get('/api/gilat');
          status = res?.status;
        } catch (err) {
          console.log('authflow err:', err);
        }
      };

      authenticate();

      if (status === 200 && res?.data?.success === true) {
        // I wanted to continue writing code here
      }
    }

如果有人想查看打字稿在哪里抛出错误以及工具提示上出现的错误，我在问题的底部放了一张图片。

此处所有代码所做的就是在 try-catch 语句之前声明一个变量 res，然后尝试在之后的 if 语句中使用该变量。在 try-catch 内部有一个 api 请求，当异步请求被解析时，它将结果设置为这个 res 变量。

如果我声明 res 是一些适合其接口的初始对象，错误就会消失，例如res = { status: 403, data: ... }。

我还尝试使用以下方法初始化其类型：

let res = AuthApiRes | undefined

这解决了问题，但我发现它很乱，或者我不确定这是否只是“作弊”打字稿。

我不希望将这个变量初始化为一个空的占位符对象，而是让它在 api 解析之前保持未分配状态。

这是否可能，如果不可能，我如何在不初始化变量或为它在声明期间键入的内容设置联合“或”未定义的情况下消除此错误？

Answer 1

我还尝试使用以下方法初始化其类型：

let res: AuthApiRes | undefined

这解决了问题，但我发现它很乱，或者我不确定这是否只是“作弊”打字稿。

当一个变量被声明但没有被初始化时，它的值是undefined，因为这个打字稿不会在你添加undefined时抱怨联合。

对我来说最好的方法是将res初始化为null，然后检查它：

let res: AuthApiRes | null = null;

if(res) {
  if(status === 200 && res.data?.success === true) {
    ...
  }
}

status 变量也是如此。

如果您不喜欢这种方法，可以在res 前加上!

let res!: AuthApiRes

这暗示 typescript 你实际上会为 res 赋值，但你会丢失 typescript 检查，对我来说，这是不值得的。