제너레이터 Generators 정리

제이밍·2021년 9월 28일

제너레이터 함수는 일반 함수와 동작 방식이 다르다. 제너레이터 함수를 호출하면 코드가 실행되지 않고, 대신 실행을 처리하는 특별 객체, 제너레이터 객체가 반환된다.

function* generateSequence() {
  yield 1;
  yield 2;
  return 3;
}

// '제너레이터 함수'는 '제너레이터 객체'를 생성합니다.
let generator = generateSequence();
alert(generator); // [object Generator]

*

가장 큰 특징으로는 function 에 *이 붙는 것인데,
익숙지 않은 * function은 단순히 javascript 생성기 함수를 만들고 있음을 알리는 것이다.

모든 생성기 함수는 function* 구문을 사용!

yield

yield 키워드는 본질적으로 생성기에서 중단을 구성하며 yield가 발생할 때마다 생성기는 작동을 중지하고 값을 반환한다.

Generators 동작방식

생성기 객체가 작동하는 곳이며, 실제로 생성기에서 코드를 실행하지 않고 생성기 함수에서 코드를 실행하는데 사용할 수 있는 생성기 객체를 반환한다.

간단한 예로 들자면,

function* simpleGenerator() {
  console.log('Before 1')
  yield 1 // {value: 1, done: false}
  console.log('Before 2')
  yield 2 // {value: 2, done: false}
  console.log('End of Generator')
  return 3 // {value: 3, done: true}
}

const generatorObject = simpleGenerator()
console.log(generatorObject.next().value)
console.log(generatorObject.next().value)

// OUTPUT IN ORDER:
// Before 1
// 1
첫번째 콘솔 종료
// Before 2
// 2
두번째 콘솔 종료

next()

next()는 제너레이터의 주요 메서드입니다. next()를 호출하면 가장 가까운 yield <value>문을 만날 때까지 실행이 지속된다.
(value를 생략하게 되면 undefiend가 된다.)

next()는 항상 아래 두 프로퍼티를 가진 객체를 반환

value: 산출 값
done: 함수 코드 실행이 끝났으면 true, 아니라면 false
(return을 만나기전까지는 true값을 반환한다.)

제너레이터와 이터러블 관계

제너레이터는 이터러블이기 때문에 for ...of 반복문을 사용해 값을 얻을 수 있습니다.

for..of 공부하고오기

function* generateSequence() {
  yield 1;
  yield 2;
  return 3;
}

let generator = generateSequence();

for(let value of generator) {
  alert(value); // 1, 2가 출력됨
}