[DEV] 02 - 이터러블 / 이터레이터 (함수형프로그래밍 es06)

headerimg 함수형 프로그래밍과 javascript es6를 깊게 파보기.

이터러블(Iterable) / 이터레이터(Iterator) 프로토콜

이터러블(Iterable) 순회 가능한 객체를 가르키는 말. for of는 대부분 배열의 순회에 사용 된다고 알고 있지만 사실 순회가능(iterable)한 모든 객체를 대상으로 사용할 수 있다.

어떤 것이 이터러블 일까? Symbol.iterator 심볼 속성을 가지고 있고 이터레이터 객체를 반환하는 객체 말한다. 이런 스펙을 이터러블 프로토콜이라 하고 이 객체를 이터러블 객체라고 한다.

이터레이터(Iterator) 위에 서 말한 이터러블한 객체가 [Symbol.interator]() 메소드로 반환하는 객체를 이터레이터 라고 한다. 이터레이터는 next() 메소드와 done, value 객체을 가진 객체이고 이 스펙을 이터레이터 프로토콜이라고 한다.

정리

  • 이터러블 : 이터레이터를 반환하는 [Symbol.iterator]()를 가진 값.
  • 이터레이터 : { value, done } 객체를 리턴하는 next()를 가진 값.
  • 이터러블/이터레이터 프로토콜 : 이터러블과 for of 등과 함께 사용할 수 있도록한 규약
const num = [1,2,3,4]; //이터러블

imgG

console.log(num);에 __proto__에 들어있는 심볼 이터레이터


imgG

arr는 이터러블이고 이터레이터를 반환한다.

커스텀 이터러블, 이터레이터 프로토콜 정의

사용자 정의 이터러블, 이터레이터를 만들어보면 속사정이 이해가 쉽다.

const arr = [1,2,3];
let iter1 = arr[Symbol.iterator]();
iter1.next();
for(const a of iter1) console.log(a);
/*
2
3
*/


const iterable = {
    [Symbol.iterator](){
        let i = 1;
        return{
            next(){
                return i > 3 ? { value: undefined, done: true } : { value: i++, done: false };
            },
            [Symbol.iterator]() { return this; }
        }
    }
}
let iterator = iterable[Symbol.iterator]();
console.log(iterator.next()); // {value: 1, done: false}
console.log(iterator.next()); // {value: 2, done: false}
console.log(iterator.next()); // {value: 3, done: false}
console.log(iterator.next()); // {value: undifined, done: true} done이 ture가 되면 멈춘다.
for(const a of iterator) console.log(a);
/*
1
2
3
*/

와.. 그래 그래

그래서.. for of 돌릴라고 이런걸 만든건가? 아니겠지
이터러블/이터레이터 ( 이터레이션 ) 프로토콜은 for-of, spread(전개연산자), Map/Set 생성자 등에 사용된다. 그 대상 데이터들은 배열, 문자열, Map/Set, Dom을 사용할 수 있다.


© 2018. All rights reserved.

Powered by blowROCK