타입스크립트에서 비동기 이터레이션을 구현하려면 Symbol.asyncIterator를 사용하여 객체를 이터러블로 만들고, async 및 await 키워드를 사용하여 비동기 작업을 처리해야 합니다.

1. 비동기 이터러블 객체 구현

비동기 이터러블 객체를 만들기 위해, Symbol.asyncIterator를 사용하여 asyncIterator 메서드를 정의해야 합니다. 이 메서드는 AsyncIterable 객체를 반환해야 합니다.

예를 들어, 아래와 같이 구현할 수 있습니다:

class AsyncIterableObject implements AsyncIterable<number> {
  constructor(private data: number[]) {}

  async *[Symbol.asyncIterator]() {
    for (const item of this.data) {
      // 비동기 작업 수행
      yield await this.asyncTask(item);
    }
  }

  private async asyncTask(item: number): Promise<number> {
    // 비동기 작업 구현
    return new Promise((resolve) => {
      setTimeout(() => resolve(item * 2), 1000);
    });
  }
}

const asyncIterableObj = new AsyncIterableObject([1, 2, 3]);

위 예제에서 AsyncIterableObject 클래스는 AsyncIterable을 구현하고, Symbol.asyncIterator 메서드를 사용하여 비동기적으로 순회할 수 있는 이터러블 객체를 생성합니다.

2. 비동기 이터레이션 사용

비동기 이터러블 객체를 이터레이션하려면 for await...of 루프를 사용하여 비동기적으로 값을 가져올 수 있습니다.

(async () => {
  for await (const value of asyncIterableObj) {
    console.log(value);
  }
})();

위 예제에서 for await...of 루프는 asyncIterableObj의 비동기 이터러블 객체를 이터레이션하면서 각 값을 순서대로 가져와 콘솔에 출력합니다.

이렇게 하면 타입스크립트에서 비동기 이터레이션을 구현하고 사용할 수 있습니다.

참고 문헌:

• MDN Web Docs
• 타입스크립트 공식 문서