JS Iterator / Generator

출처 및 참고 :

• Zzolab Blog
• mdn web docs

반복자 (Iterator)

Iterator는 자바스크립트에서 시퀀스를 정의하고 종료시 반환값을 잠재적으로 정의하는 객체 쉽게 말해서 순환이 가능한 객체를 정의한다. Iterator는 두개의 속성 (value,done)을 반환하는 next() 메소드를 사용하여 객체의 Iterator protocol 을 구현한다.

Iterator를 생성하면 next() 메소드를 반복적으로 호출하여 명시적으로 반복시킬 수 있다. Iterator를 반복시키는 것은 한번씩만 가능하기 때문에 Iterator를 소모시킨다 라고 할 수 있다. 마지막 값을 호출하면 done의 값은 ture 가 되고 이후 값부터는 undefined를 리턴한다. 이러한 것을 Iterator protocol 이라고 한다.

자바스크립트에서 가장 일반적인 Iterator는 배열 반복자이고 배열의 각 값을 순서대로 반환한다.

사용자 정의 Iterator

const iterator = {
    [Symbol.iterator](i) {
        return {
            next() {
                return i == 0 ? {
                    done: true
                } : {
                    value: i--,
                    done: false
                };
            },
            [Symbol.iterator]() {
                return this;
            }
        }
    }
}
let it = iterator[Symbol.iterator](5);

for(const a of it) console.log(a); // 5,4,3,2,1

console.log(it.next()); //{ value: 5, done: false }
console.log(it.next()); //{ value: 4, done: false }
console.log(it.next()); //{ value: 3, done: false }
console.log(it.next()); //{ value: 2, done: false }
console.log(it.next()); //{ value: 1, done: true }

위처럼 반복 가능한 객체를 iterable 한 객체라고 한다. (배열은 대표적인 이터러블)

Generator functions

Generator는 Iterator 이자 Iterator를 리턴 하는 함수이다 쉽게 말해 Iterator을 만드는 가장 쉬운 방법은 Generator 다.

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

const iterator = gen();
console.log(iterator.next()); // {value:1, done:false}
console.log(iterator.next()); // {value:2, done:false}
console.log(iterator.next()); // {value:3, done:true}
console.log(iterator.next()); // {value:undefined, done:undefined}