이터레이터 ( iterator )

엄강우·2022년 6월 11일
0

TIL

목록 보기
34/43
post-custom-banner

이터레이터는 ES6에 도입된 새로운 개념입니다. 제너레이터가 이터레이터에 의존하는 개념인 만큼 이터레이터에 대한 개념을 확실히 하고 가는 것이 좋습니다.

js를 가지고 개발을 하다보면 iterable하지 않습니다라는 오류를 자주 접하게 되는데요. 쉽게 말하면 iterable하게 하는 것이 바로 이터레이터 입니다.

ES6 이전 배열 순회

for(let i=0; i < arr.length; i+=1){} // es5까지는 배열 순회를 위해 i라는 변수를 필요로 했습니다.

이터레이터가 도입된 배열 순회

for (const a of arr){} // 이터레이터가 도입되고 나서는 다음과 같이 짧게 순회 할 수 있습니다.

이터러블하다

이터러블 하다는 것은 [Symbol.interator] 메소드를 가지고 있으며 이 메소드가 iterator와 같이 동작을 하는 것을 의미합니다.

const a = {
	[Symbol.iterator]() {
      	let i = 4
    	return {
        	next() {
            	return i===0 ? {done:true} : {value: --i, done: false}
            },
          	// iterator의 [Symbol.interator]()가 자기 자신을 반환하는 경우
          	// well formed iterator입니다.
          	[Symbol.iterator]() {
            	return this
            }
        }
    }
}
const iterator = a[Symbol.iterator]()
iterator.next()  // {value: 4, done: false}
iterator.next()  // {value: 3, done: false}
iterator.next()  // {value: 2, done: false}
iterator.next()  // {value: 1, done: false}
iterator.next()  // {value: undefined, done: true}
iterator.next()  // {value: undefined, done: true}

이터레이터 객체는 donetrue가 되면 순회를 멈춥니다. 위에서 본 for ... of문도 donetrue가 아닐때 까지만 순회를 하게끔 설계 되어 있음을 예상할 수 있습니다.

js에서는 배열 뿐만 아니라 Obj, Set 그리고 Map과 같은 객체들도 이터러블합니다.

profile
안녕하세요 프론트엔드 개발자를 꿈꾸는 엄강우입니다.
post-custom-banner

0개의 댓글