AsyncGenerator

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

AsyncGenerator 객체는 async generator function에 의해 반환되며, 비동기 순회 프로토콜과 비동기 반복자 프로토콜을 모두 준수합니다.

비동기 생성기 메서드는 항상 Promise 객체를 산출합니다.

AsyncGenerator는 숨겨진 AsyncIterator 클래스의 하위 클래스입니다.

시도해보기

생성자

AsyncGenerator 생성자와 대응되는 JavaScript 개체는 없습니다. 비동기 생성기 함수에서 AsyncGenerator의 인스턴스를 반환해야 합니다.

js
async function* createAsyncGenerator() {
  yield await Promise.resolve(1);
  yield await Promise.resolve(2);
  yield await Promise.resolve(3);
}
const asyncGen = createAsyncGenerator();
asyncGen.next().then((res) => console.log(res.value)); // 1
asyncGen.next().then((res) => console.log(res.value)); // 2
asyncGen.next().then((res) => console.log(res.value)); // 3

비동기 생성기 함수가 생성한, 모든 객체가 공유하는 프로토타입 객체인 숨겨진 객체만 있습니다. 이 객체는 클래스처럼 보이게 하기 위해 종종 AsyncGenerator.prototype으로 그려지지만, AsyncGeneratorFunction은 실제 JavaScript 개체이기 때문에 AsyncGeneratorFunction.prototype.prototype라고 하는 것이 더 적절합니다. AsyncGenerator 인스턴스의 프로토타입 체인을 이해하려면 AsyncGeneratorFunction.prototype.prototype를 참조하세요.

인스턴스 속성

아래 속성은 AsyncGenerator.prototype에 정의되어 있으며 모든 AsyncGenerator 인스턴스에서 공유됩니다.

AsyncGenerator.prototype.constructor

인스턴스 객체를 생성하는 생성자 함수입니다. AsyncGenerator 객체를 위한 초기 값은 AsyncGeneratorFunction.prototype입니다.

참고: AsyncGenerator 객체는 자신을 생성한 비동기 생성기 함수의 참조를 저장하고 있지 않습니다.

AsyncGenerator.prototype[@@toStringTag]

@@toStringTag 속성의 초기 값은 문자열 "AsyncGenerator"입니다. 이 속성은 Object.prototype.toString()에서 사용합니다.

인스턴스 메서드

부모 AsyncIterator에서 인스턴스 메서드를 상속합니다.

AsyncGenerator.prototype.next()

Promise를 반환하며, yield 표현식에 의해 산출되어 주어진 값으로 이행됩니다.

AsyncGenerator.prototype.return()

현재 일시 중단된 위치에서 생성기 본문에 return 문이 삽입되어 생성기를 종료하고 try...finally 블록과 결합하여 정리 작업을 수행할 수 있는 것처럼 작동합니다.

AsyncGenerator.prototype.throw()

현재 일시 중단된 위치의 생성기 본문에 throw 문을 삽입하여 생성기에 오류 상태를 알리고 오류를 처리하거나 정리를 수행하고 스스로 닫을 수 있도록 하는 것처럼 작동합니다.

예제

비동기 생성기 순회

아래는 비동기 생성기를 순회하는 예제입니다. 1~6의 값을 점점 줄어드는 시간 간격으로 콘솔에 남깁니다. 프로미스가 산출될 때마다 for await...of 루프 내에서 자동으로 이행되는 것을 확인할 수 있습니다.

js
// 비동기 작업입니다. 실제로 더 유용한 일을 하고 있다고 가정해 보시기 바랍니다.
function delayedValue(time, value) {
  return new Promise((resolve /*, reject*/) => {
    setTimeout(() => resolve(value), time);
  });
}

async function* generate() {
  yield delayedValue(2000, 1);
  yield delayedValue(100, 2);
  yield delayedValue(500, 3);
  yield delayedValue(250, 4);
  yield delayedValue(125, 5);
  yield delayedValue(50, 6);
  console.log("All done!");
}

async function main() {
  for await (const value of generate()) {
    console.log("value", value);
  }
}

main().catch((e) => console.error(e));

명세서

Specification
ECMAScript Language Specification
# sec-asyncgenerator-objects

브라우저 호환성

BCD tables only load in the browser

같이 보기