[typescript] `async/await` 키워드를 사용하여 프로미스 체이닝을 더 읽기 쉽게 작성할 수 있나요?

15 Dec 2023

typescript

아래는 TypeScript로 작성된 async/await를 사용한 간단한 예제입니다.

async function getUserInfo(userId: number): Promise<string> {
  const user = await getUser(userId);
  const userInfo = await getUserDetails(user);
  return userInfo;
}

async function getUser(userId: number): Promise<string> {
  // 비동기 작업
  return "User";
}

async function getUserDetails(user: string): Promise<string> {
  // 비동기 작업
  return "User details";
}

(async () => {
  const userInfo = await getUserInfo(123);
  console.log(userInfo);
})();

위 예제에서 getUserInfo 함수는 getUser와 getUserDetails 함수를 await를 사용하여 순차적으로 호출하고, 각 함수의 결과를 비동기적으로 받아와서 처리합니다. 이렇게 하면 코드가 콜백이나 연속적인 .then() 체인을 사용하는 것보다 더 읽기 쉽고 유지보수가 쉬워집니다.

async/await는 프로미스를 사용하는 코드를 보다 간결하고 직관적으로 만들어주므로, 프로미스 체이닝을 더 읽기 쉽게 작성할 수 있습니다.

덧붙여, async/await의 다양한 활용 예시와 주의할 점에 대해 더 알고 싶으면 다음 링크를 참고하세요: MDN Web Docs - async 함수