제너레이터와 이터레이터

1) 제너레이터와 이터레이터

제너레이터 : 이터레이터이자 이터러블을 생성하는 함수, well-formed iterator를 리턴하는 함수

어떠한 값들을 제너레이터를 통해서 이터러블로 만들고, for.. of 문을 통해 순회를 할 수 있게 만들 수 있다는 것!

    function *gen() {
        yield 1;
        yield 2;
        yield 3;
    }
    let iter = gen();
    console.log(iter[Symbol.iterator]() == iter); // true 반환

 

예제

10까지의 홀수만 뽑아내는 제너레이터 함수

    function *odds(l) {
        for(let i = 0; i < l; i++) {
            if (i % 2) yield i;
        }
    }
    let iter2 = odds(10);
    console.log(iter2.next());
    console.log(iter2.next());
    console.log(iter2.next());
    console.log(iter2.next());
    console.log(iter2.next());

출력 결과

무한수열

    function *infinity(i = 0) {
        while (true) yield i++;
    }
    
    let iter = infinity();
    console.log(iter.next());
    console.log(iter.next());
    console.log(iter.next());
    console.log(iter.next());
    console.log(iter.next());
    console.log(iter.next());

next 함수를 사용해서 계속 출력해도, 사용자가 입력해야지만 계속해서 출력되는 것이기 때문에

브라우저가 멈추는 버그는 생기지 않는다.

 

2) odds

// odds

// 무한수열 표현
// 평가하는 시점에 실행되기 때문에 프로그램이 멈추거나 하는 현상은 없다
function *infinity(i = 0) {
    while (true) yield i++;
}
function *limit(l, iter) {
    for (const a of iter) {
        yield a;
        if (a == l) return;
    }
}

function *odds(l) {
    for (const a of infinity(1)) {
        if (a % 2) yield a;
        if (a == l) return;
    }
}
let iter2 = odds(10);
console.log(iter2.next());
console.log(iter2.next());
console.log(iter2.next());
console.log(iter2.next());
console.log(iter2.next());

// 제너레이터 함수 순회 방법
for (const a of odds(50)) {
    console.log(a);
}

제너레이터 함수 관련 다양한 예제

 

 

3) for...of, 전개 연산자, 구조 분해, 나머지 연산자

// 전개 연산자
console.log(...odds(10));
console.log([...odds(10), ...odds(20)]); // 배열로 변환

// 구조 분해
const [head, ...tail] = odds(5);
console.log(...odds(5)); // 1 3 5
console.log(head); // 1
console.log(tail); // [3, 5]

const [a, b, ...rest] = odds(10);
console.log(a);
console.log(b);
console.log(rest);