제너레이터

제너레이터는 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수이다.

 

제너레이터 함수를 호출하면 일반 함수처럼 함수 코드 블록을 실행하는 것이 아니라 제너레이터 객체를 생성해 반환한다.

제너레이터 함수가 반환한 제너레이터 객체는 이터러블이면서 동시에 이터레이터이다.

function* genFunc() {
  yield 1;
  yield 2;
  yield 3;
}
const generator = genFunc();
console.log(Symbol.iterator in generator); // 이터러블이면서
console.log('next' in generator); // 이터레이터이다.

 

제너레이터 객체는 이터레이터지만 next 메서드를 포함해서 return, throw 총 3가지의 메서드를 갖는다.

 

먼저 next 메서드를 호출하면 yield 표현식까지 코드 블록을 실행하고 yield된 값을 value 프로퍼티 값으로, 

false를 done 프로퍼티 값으로 갖는 이터레이터 리절트 객체를 반환한다.

{ value : yield 키워드 옆에 있는 값, done : false }

function* genFunc() {
  yield 1;
  yield 2;
  yield 3;
}
const generator = genFunc();
console.log(generator.next());
console.log(generator.next());
console.log(generator.next());

 

return 메서드를 호출하면 인수로 전달받은 값을 value 프로퍼티로, true를 done 프로퍼티 값으로 갖는 이터레이터 리절트 객체를 반환한다.

{ value : return 메서드 인수, done : true }

function* genFunc() {
  yield 1;
  yield 2;
  yield 3;
}
const generator = genFunc();
console.log(generator.next());
console.log(generator.next());
console.log(generator.next());
console.log(generator.return('HELLO'));

 

이렇게 제너레이터 함수를 정의할 때도 사용할 수 있다.

단, for ... of 구문을 통해 요소를 순회할 때는 return 값은 순회하지 않는다.

function* genFunc() {
  yield 1;
  yield 2;
  yield 3;
  return 'HELLO';
}
const generator = genFunc();
console.log(generator.next());
console.log(generator.next());
console.log(generator.next());
console.log(generator.next());

// 단, 순회할 때는 return 메서드의 인자값은 순회하지 않는다.
for (const a of genFunc()) {
  console.log(a); // 1, 2, 3까지만 출력
}

 

throw 메서드를 호출하면 인수로 전달한 에러를 발생시키고, undefined를 value 프로퍼티 값으로, true를 done 프로퍼티 값으로 갖는 이터레이터 리절트 객체를 반환한다.

{ value :  undefined, done : true }

function* genFunc() {
  try {
    yield 1;
    yield 2;
    yield 3;
  } catch (e) {
    console.error(e); // ERROR
  }
}

const generator = genFunc();
console.log(generator.next()); // { value: 1, done: false }
console.log(generator.throw('ERROR')); // { value: undefined, done: true }

 

자바스크립트는 제너레이터의 코드를 통해 어떠한 값이든 순회할 수 있게끔 만들 수 있다.

함수형 프로그래밍의 다형성을 높이는데 아주 중요한 포인트이다.

function* gen() {
  yield 1;
  if (false) yield 2;
  yield 3;
}

for (const a of gen()) console.log(a);