[typescript] 타입스크립트 비동기 프로그래밍 개요

14 Dec 2023

typescript

본 문서에서는 타입스크립트에서의 비동기 프로그래밍에 대해 알아보겠습니다. 비동기 프로그래밍은 UI 이벤트 처리, 파일 읽기/쓰기, 네트워크 통신 등에서 매우 중요합니다. 타입스크립트에서는 여러 가지 방법을 통해 비동기 프로그래밍을 구현할 수 있습니다.

Promise와 async/await

ES6부터 지원되는 Promise는 비동기 작업의 결과를 나타내는 객체입니다. 타입스크립트에서는 이를 활용하여 비동기 코드를 보다 간편하게 작성할 수 있습니다.

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

// async/await를 이용한 사용
async function processData() {
  try {
    const result = await getData();
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

위의 예시에서 getData 함수는 1초 후에 비동기 작업이 완료되는 Promise를 리턴합니다. 이를 async 함수 내에서 await 키워드로 호출하여 데이터를 처리합니다.

콜백 함수

이전부터 사용되어온 콜백 함수를 통한 비동기 처리 방식도 타입스크립트에서 지원합니다. 하지만 Promise나 async/await에 비해 가독성이 낮고 복잡성이 높아지는 단점이 있습니다.

function fetchData(callback: (data: string) => void) {
  // 비동기 작업 수행
  setTimeout(() => {
    callback('Data fetched via callback');
  }, 1000);
}

// 콜백 함수를 이용한 사용
fetchData((result) => {
  console.log(result);
});

RxJS

타입스크립트에서는 RxJS를 이용한 반응형 프로그래밍을 통해 비동기 작업을 보다 효율적으로 처리할 수 있습니다.

import { interval } from 'rxjs';

const subscription = interval(1000).subscribe((count) => {
  console.log(`Count: ${count}`);
});

setTimeout(() => {
  subscription.unsubscribe();
}, 5000);

결론

타입스크립트에서는 Promise, async/await, 콜백 함수, RxJS 등을 통해 다양한 방식으로 비동기 프로그래밍을 지원합니다. 이를 적절히 활용하여 효율적이고 가독성 있는 비동기 코드를 작성할 수 있습니다.

참고문헌:

https://www.typescriptlang.org/
https://rxjs-dev.firebaseapp.com/