Typescript에서 비동기 요청의 응답으로 설정되는 변수를 초기화하는 방법은 무엇입니까?

Typescript에서 비동기 요청의 응답으로 설정되는 변수를 초기화하는 방법은 무엇입니까?

타이프스크립트에 비교적 익숙하지 않은 저는 첫 번째 프로젝트에서 직면하지 못한 문제에 부딪혔습니다. Try-catch 내부에서 api 요청에 변수를 선언하면 이 변수에 대한 작업에 대해 타이프스크립트 오류를 던지는 것 같습니다.

아래 이슈를 보여주기 위해 샘플 코드를 작성했습니다.

이 변수는 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
      }
    }

만약 누군가 타이프스크립트가 어디에서 오류를 던지고 있고 툴팁에 오류가 나타나는 것을 보고 싶다면 나는 질문의 맨 아래에 이미지를 넣었다.

여기서 코드가 하는 모든 것은 트라이캐치 문 앞에 변수를 선언한 다음, 이후에 이 변수를 if 문에 사용하는 것이다. try-catch 내부에는 비동기 요청이 해결될 때 결과를 이 변수로 설정하는 api 요청이 있습니다.

res를 인터페이스에 맞는 초기 개체로 선언하면 오류가 사라집니다.

나는 또한 다음을 사용하여 그것의 유형을 초기화해 보았다:

let res = AuthApiRes | undefined

그것이 문제를 해결하지만 나는 그것이 지저분하다고 생각하거나 오히려 이것이 단지 "부정행위" 유형의 스크립트인지 확신할 수 없다.

이 변수를 빈 자리 표시자 개체로 초기화하지 않고 api가 해결될 때까지 할당되지 않은 상태로 유지하고 싶습니다.

이것이 가능한가요, 만약 그렇지 않다면, 변수를 초기화하거나 선언하는 동안 입력에 대해 정의되지 않은 유니언 "또는"을 설정하지 않고 어떻게 이 오류를 제거할 수 있나요?

---

나는 또한 다음을 사용하여 그것의 유형을 초기화해 보았다:

let res: AuthApiRes | undefined

그것이 문제를 해결하지만 나는 그것이 지저분하다고 생각하거나 오히려 이것이 단지 "부정행위" 유형의 스크립트인지 확신할 수 없다.

변수가 선언되었지만 초기화되지 않은 경우 값은 입니다. 이 형식 스크립트는 유니언에 추가할 때 불평하지 않습니다.

가장 좋은 방법은 로 초기화한 다음 확인하는 것입니다.

let res: AuthApiRes | null = null;

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

변수도 마찬가지입니다.

이 접근 방식이 마음에 들지 않으면 다음과 같이 접두사를 붙일 수 있습니다.

let res!: AuthApiRes

이 힌트는 실제로 값을 할당할 유형 스크립트를 나타내지만 유형 스크립트 검사가 손실되고, 나에게는 가치가 없습니다.