[typescript] 비동기 이터레이션과 await for...of 문을 사용한 데이터 변환 방법

이번 글에서는 TypeScript에서 비동기 이터레이션과 await for...of를 사용하여 데이터를 변환하는 방법에 대해 알아보겠습니다.

비동기 이터레이션과 await for...of란?

비동기 이터레이션은 Symbol.asyncIterator를 사용하여 비동기적으로 이터러블한 객체를 생성하는 것을 말합니다. await for...of는 이 비동기 이터러블을 순회하는 구문으로, await 키워드를 사용하여 비동기적으로 값을 받아올 수 있습니다.

Promise 배열을 이용한 예시

const asyncData = async () => {
  const data = [1, 2, 3, 4, 5];
  const transformedData = [];

  for await (const item of data) {
    const processedItem = await processAsync(item);
    transformedData.push(processedItem);
  }

  return transformedData;
};

const processAsync = async (value: number) => {
  return value * 2;
};

asyncData().then(result => {
  console.log(result); // [2, 4, 6, 8, 10]
});

위 예시에서는 await for...of를 사용하여 Promise 배열을 변환합니다.

비동기 이터러블을 이용한 예시

class AsyncData implements AsyncIterable<number> {
  private data = [1, 2, 3, 4, 5];

  async *[Symbol.asyncIterator]() {
    for (const item of this.data) {
      yield await processAsync(item);
    }
  }
}

const asyncData = new AsyncData();
const transformedData = [];

( async () => {
  for await (const item of asyncData) {
    transformedData.push(item);
  }
  console.log(transformedData); // [2, 4, 6, 8, 10]
})();

위 예시는 비동기 이터러블을 이용하여 데이터를 변환합니다.

결론

이렇게 TypeScript에서 비동기 이터레이션과 await for...of를 사용하여 데이터를 변환하는 방법에 대해 알아보았습니다. 이러한 방식을 사용하면 비동기 데이터를 효율적으로 처리할 수 있습니다.