[JS] 제너레이터 실습 - 모던자바스크립트 DeepDive

모던JS 제너레이터 챕터를 학습하며 예제를 직접 만들고, 헷갈릴만한 문제를 정리해보았다.

스터디때도 팀원들에게 도움이 많이 된 것 같아 블로그에도 글을 남겨본다.

 

 

문제1

function* genFunc(){
    const x = yield 1;
    const y = yield (x+10)
    yield x+y 
    }

 const gen = genFunc()

위 코드에 대하여

gen.next()
gen.next(10)
gen.next(30)

를 실행하였을 때 반환되는 객체의 형식은

{value: @, done: @}

입니다.

마지막 gen.next(30) 대하여 예상되는 반환객체를 작성해주세요.

답: {value: 40, done: false}

 

 

 

 

문제2

function* genFunc(){
    const x = yield 1;
    const y = yield (x+10)
    yield x+y 
    }

 const gen2 = genFunc()

위 코드에 대하여 다음과 같이 실행할 경우

 gen2.next(10)
 gen2.next(10)
 gen2.next()
 gen2.next()

각각의 실행 코드에 대해서 반환되는 객체를 작성해주세요

답:

{value: 1, done: false}
{value: 20, done: false}  
{value: NaN, done: false}  
{value: undefined, done: true}

 

 

 

 

문제3

function* genFunc(){
    const x = yield 1;
    const y = yield (x+10)
    yield x+y 
    }

 const gen = genFunc()

위 코드에 대하여

gen.next()
gen.next(10)
gen.next(10)

마지막 gen.next(10) 대하여 예상되는 반환 객체를 작성해주세요.

 

답

{value: 20, done: false}

 

 

꽤 헷갈릴 수 있는 문제이므로 직접 콘솔창에 찍어보며 과정을 따라가는 것도 좋아보인다.