[typescript] 타입스크립트에서의 비동기 작업 동기화 방법

14 Dec 2023

typescript

타입스크립트는 JavaScript에 정적 타입을 추가한 언어로, 자바스크립트의 확장된 기능을 제공합니다. 비동기 작업을 다룰 때, Promise와 async/await를 사용하여 동기화할 수 있습니다. 이 글에서는 타입스크립트에서의 비동기 작업을 어떻게 동기화하는지 알아보겠습니다.

Promise 활용

Promise는 비동기 처리의 최종 완료 또는 실패 결과와 그 결과값을 나타냅니다. Promise를 사용해 비동기 작업의 동기화를 보장할 수 있습니다. 아래는 Promise를 활용한 간단한 예제입니다.

function fetchData(): Promise<string> {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Data fetched successfully');
    }, 1000);
  });
}

fetchData().then((data) => {
  console.log(data);
});

위 예제에서 fetchData 함수는 Promise를 반환하고, then을 통해 데이터를 처리합니다. 이를 통해 비동기 작업을 동기적으로 처리할 수 있습니다.

async/await 활용

async/await는 Promise를 더 쉽게 다룰 수 있도록 도와주는 문법입니다. 함수 앞에 async 키워드를 붙이고, 비동기 처리를 기다리는 부분에 await 키워드를 붙여 사용합니다. 아래는 async/await를 활용한 예제입니다.

function fetchData(): Promise<string> {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Data fetched successfully');
    }, 1000);
  });
}

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

getData();

위 예제에서 getData 함수는 fetchData 함수의 결과를 기다렸다가 데이터를 출력합니다. 이를 통해 비동기 작업을 동기적으로 처리할 수 있습니다.

마무리

타입스크립트에서는 Promise와 async/await를 활용하여 비동기 작업을 동기화할 수 있습니다. 이러한 기능을 활용하여 코드의 가독성을 높이고 유지보수를 용이하게 할 수 있습니다. JavaScript 및 타입스크립트에서 비동기 작업을 다룰 때는 Promise와 async/await를 적절히 활용하는 것이 중요합니다.

참고 문헌:

이제 타입스크립트에서의 비동기 작업 동기화 방법을 알아보았는데, 다양한 상황에 맞게 Promise와 async/await를 적절히 활용하여 효율적인 코드를 작성할 수 있을 것입니다.