LHJ

I'm a FE developer.

12. iterator / generator - for ... of

10 Aug 2020 » codespitz_re

for … of 구문

iterator 를 소모하는 구문으로 for … of 라는 정식 구문이 생겼다.
이 문은 iterator 예시에서 쓰인 while(true) 처럼 반복에만 집중해주는 문이라 할 수 있다.
기존의 for 문과는 다르다.
for … of 문은 권한이 별로 없는 문이라 할 수 있다. while(true) 처럼.

const loop = (iter, f) => {
    if (typeof iter[Symbol.iterator] == 'function') {
        iter = iter[Symbol.iterator]();
    }else return;

    if (typeof iter.next != 'function') return;

    do{
        const v = iter.next();
        if (v.done) return; 
        f(v.value); 
    }while(true)
}

const iter = {
    arr: [1, 2, 3, 4],
    [Symbol.iterator]() {return this;},
    next() {
        return {
            done: this.arr.length == 0,
            value: this.arr.pop()
        }
    }
};

loop(iter, console.log);

즉, 사실은 아까 만들었던 loop 같은 함수를 만들 필요가 없다. for … of 문이 있기 때문이다. 위에서 만들었던 loop 함수를 사실 아래처럼 손쉽게 쓸 수 있는 것이다.

const iter = {
    [Symbol.iterator](){return this;},
    arr: [1, 2, 3, 4],
    next(){
        return {
            done: this.arr.length == 0,
            value: this.arr.pop()
        }
    }
}

// for of 문은 done은 알아서 처리하고, value만 따로 받아 처리할 수 있다.
for (const v of iter) {
    console.log(v);
}

// 4
// 3
// 2
// 1