👶 TypeScript

반복자

개발자 린다씨 2023. 1. 11. 18:00
반응형

반복자(Iterator)

반복자(iterator)와 제너레이터(generator)는 상생관계입니다.

 

제너레이터로 값의 스트림을 생성할 수 있고, 반복자로 생성된 값을 소비할 수 있기 때문입니다.

 

가령 createFibonacciGenerator 함수를 호출하면 Symbol.iterator 프로퍼티와 next 메서드를 모두 정의한 값을 얻게 됩니다. 즉, 이터러블과 반복자 두 가지가 결합된 제너레이터가 반환됩니다.

 

Symbol.iterator와 next를 구현하는 객체(또는 클래스)를 만들어 반복자나 이터러블을 직접 정의할 수 있습니다.

 

아래는 1에서 10까지의 숫자를 반복하는 반복자를 정의하는 예시입니다.

let numbers = {
    *[Symbol.iterator]() {
        for (let n = 1; n <= 10; n++){
            yield n
        }
    }
}

반복자 코드를 코드 편집기에 입력한 다음 마우스를 올려보면, TypeScript가 반복자 코드의 타입을 어떻게 추론하는지 확인할 수 있습니다.

 

numbers는 이터러블이며, 제너레이터 함수 number[Symbol.iterator]()를 호출하면 이터러블 반복자가 반환됩니다.

 

커스텀 반복자뿐 아니라 JavaScript의 내장 컬렉션 타입(Array, Map, Set, String 등)의 반복자도 정의할 수 있습니다.

let numbers = {
    *[Symbol.iterator]() {
        for (let n = 1; n <= 10; n++){
            yield n
        }
    }
}

// for-of로 반복자 반복
for(let a of numbers){
    console.log(a + ' 등'); // 1 ~ 10 등
}

// 반복자 스프레드
let allNumbers = [...numbers] // number[]

// 반복자 구조 분해 할당(destructure)
let [one, two, ...rest] = numbers // [number, number, number[]]

TSC 플래그: downlevelIteration

TypeScrip를 ES2015 이전 버전의 JavaScript로 컴파일 할 땐 tsconfig.json에서 downlevelIteration 플래그로 커스텀 반복자를 활성화할 수 있습니다.

 

응용 프로그램의 번들 크기가 커지는 것을 하지 않으면 downlevelIteration을 비활성화하는 것이 좋습니다.

용어 정리

이터러블(iterable; 반복할 수 있는)

Symbol.iterator라는 프로퍼티(반복자를 반환하는 함수)를 가진 모든 객체

반복자(iterator)

next라는 메서드(value, done 두 프로퍼티를 가진 객체를 반환)를 정의한 객체

 

 

반응형