TypeScript에서 async/await 키워드를 사용하면 비동기 작업을 동기적으로 처리할 수 있습니다.

async 함수 작성하기

먼저, async 키워드를 사용하여 비동기적인 작업을 수행하는 함수를 만들어야 합니다. 이 함수는 Promise 를 반환하거나 await 키워드를 사용하여 비동기적인 작업을 수행합니다.

예를 들어, 아래와 같이 async 키워드를 사용하여 비동기 작업을 수행하는 함수를 정의할 수 있습니다.

async function fetchData(): Promise<string> {
  // 비동기 작업 수행
  const data = await fetch('https://example.com/api/data');
  return data;
}

위의 예제에서 fetchData 함수는 async 키워드로 정의되었고, Promise 를 반환합니다. 함수 내부에서 await 키워드를 사용하여 비동기적으로 데이터를 가져오고 있습니다.

await 키워드 사용하기

await 키워드는 async 함수 내에서 사용되며, 해당 키워드 뒤에 오는 명령문(주로 Promise 를 반환하는 함수 호출)이 완료될 때까지 기다립니다.

예를 들어, 위의 fetchData 함수를 호출하는 부분은 다음과 같이 작성할 수 있습니다.

async function processData() {
  const data = await fetchData();
  console.log(data);
}

위의 예제에서 processData 함수는 또 다른 async 함수로 정의되었습니다. fetchData 함수를 호출할 때 await 키워드를 사용하여 데이터가 도착할 때까지 기다립니다.

async/await를 사용하면 프로미스 체이닝을 보다 간결하게 표현할 수 있고, 코드의 가독성을 향상시킬 수 있습니다.

이와같이 async/await를 사용하여 TypeScript에서 비동기 작업을 동기적으로 처리할 수 있습니다.

참고 자료: MDN web docs, TypeScript 공식 문서