TypeScript는 JavaScript의 확장된 기능을 제공하는 프로그래밍 언어로, 비동기 작업을 다룰 때 많은 유용한 기능을 제공합니다. 여기에는 Promise, async/await 등이 있으며, 이러한 기능을 사용하여 비동기 작업을 보다 쉽게 다룰 수 있습니다. 이 포스트에서는 TypeScript에서 비동기 작업이 완료될 때까지 기다리는 다양한 방법에 대해 알아보겠습니다.

1. Promise 사용

Promise는 JavaScript에서 비동기 작업을 쉽게 처리하기 위한 객체로, TypeScript에서도 널리 사용되고 있습니다. Promise를 사용하면 비동기 작업의 완료 여부를 간단하게 확인할 수 있습니다.

다음은 Promise를 사용하여 비동기 작업을 처리하고 완료 여부를 기다리는 예제 코드입니다.

function fetchData(): Promise<string> {
  return new Promise((resolve, reject) => {
    // 비동기 작업 수행
    setTimeout(() => {
      resolve('Data fetched successfully');
    }, 2000);
  });
}

// Promise 기다리기
fetchData()
  .then((result) => {
    console.log(result); // Data fetched successfully
  })
  .catch((error) => {
    console.error(error);
  });

2. async/await 사용

async/await는 Promise를 좀 더 간결하게 다룰 수 있는 방법을 제공합니다. async 함수 내에서 await 키워드를 사용하여 비동기 작업이 완료될 때까지 기다릴 수 있습니다.

다음은 async/await를 사용하여 비동기 작업을 처리하고 완료 여부를 기다리는 예제 코드입니다.

async function fetchData(): Promise<string> {
  return new Promise((resolve, reject) => {
    // 비동기 작업 수행
    setTimeout(() => {
      resolve('Data fetched successfully');
    }, 2000);
  });
}

// async/await로 기다리기
async function getData() {
  try {
    const result = await fetchData();
    console.log(result); // Data fetched successfully
  } catch (error) {
    console.error(error);
  }
}

getData();

결론

TypeScript에서 비동기 작업 완료 여부를 기다리는 방법에는 Promise와 async/await를 활용하는 방법이 있습니다. 이러한 기능들을 적절히 활용하여 비동기 작업을 보다 효과적으로 다룰 수 있습니다.

위에서 제시한 코드는 TypeScript 환경에서 실행될 수 있으며, 실제 프로젝트에서도 비동기 작업을 다룰 때 참고할 수 있습니다.