[JS] ES6 제너레이터 알아보기.

예제를 보면서 제너레이터 작동방법을 확인하자.

 

@ 제너레이터 함수 생성 및 호출 방법

// 제너레이터를 생성할때는 function* 을 사용한다. 
// 화살표 함수로는 제너레이터를 만들 수 없다.

function* myGen() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  return 5;
}

const myItr = myGen();
console.log(myItr.next());
console.log(myItr.next());
console.log(myItr.next());
console.log(myItr.next());
console.log(myItr.next());
console.log(myItr.next());

// 출력
// { value: 1, done: false }
// { value: 2, done: false }
// { value: 3, done: false }
// { value: 4, done: false }
// { value: 5, done: true }
// { value: undefined, done: true }

// next() 함수가 호출될 때마다 yield값이 반환되고, 호출 위치가 기억된다.
// return을 만나거나 마지막 라인이 실행될때 done이 true가 되며,
// 이후의 value 값은 undefined가 된다.

 

@ next()를 호출할 때, 인수값 지정  - next()와 yield가 서로 데이터를 주고받을 수 있다.

function* myGen() {
  const x = yield 1;
  const y = yield x + 1;
  const z = yield y + 2;
  return x + y + z;
}
const myItr = myGen();

// next()에 인수를 넣음으로써
// 호출자가 제너레이터에게 값을 전달 할 수 있다.

console.log(myItr.next());
console.log(myItr.next(10));
console.log(myItr.next(20));
console.log(myItr.next(20));

// 출력
// { value: 1, done: false }
// { value: 11, done: false }  x에 10이 전달되어 10 + 1 = 11
// { value: 22, done: false }  y에 20이 전달되어 20 + 2 = 22
// { value: 50, done: true }   z에 20이 전달되어 x + y + z = 10 + 20 + 20 = 50

---

    @ 참고링크

 

https://ko.javascript.info/generators