Iterable/Iterator 정리

iterable이 뭐냐?

그 전에 원래는 배열같은걸 한번 돌려면 for문에서 arr[i] 해서 i 값을 index(key값) 0부터 length까지 지정해서 해야했음

그런데 for  ~ of 같은 건 index가 없는 map이나 set 자료형에도 쓸 수 있음 - for of는 일반 for문과는 다르게 작동한다는 소리

 

바로 iterable/iterator와 관련되어 있음

 

const arr = [1,2,3,4,5]라고 놓고

arr[Symbol.iterator] 하면 어떤 함수가 하나 나옴 // arr[Symbol.iterator] = null 하면 for of 못씀

그럼 그 함수를 실행해보면 - let x = arr[Symbol.iterator]()  // x - Array Iterator {} 라는게 나옴

이제 x.next()를 계속하면 {value : 1 , done : false} , {value : 2 , done : false} ..... {value: undefined , done : true}가 나옴

여기서 알 수 있는점

- for of는 저 value값을 한번 싹 돈다는거

- done이 true가 될때까지 돈다는거 

여기서 iterable이란 ?

- 이터레이터를 리턴하는 [Symbol.iterator]() 를 가진 값

- 위에서 했던것처럼 Arr[Symbol.iterator]() 하면 Array Iterator라는게 나옴 

그럼 Iterator란 ?

- {value, done} - key값을 가진 객체를 리턴하는 next() 라는 메서드를 가진 값

그래서 이터러블/이터레이터 프로토콜이라는 규약이 있어서 for ~ of 같은 것들이랑 함께 동작할 수 있게 만든 뭐가 있다고 함

 

map 자료형의 경우에 map.keys() 하면 mapIterator가 리턴됨(키값만 들어있는) - 이걸 next()하면 키값만 돌기때문에

key값만 뽑고 싶으면 for a of map.keys() 하면 key만 뽑을수도 있음 - values entries 이런것도 다 가능

 

그런데 이걸 직접 만들 수도 있다고 함(근데 그럴 일이 있나?)

근데 또 잘만든 iterator가 있고 뭐 그런다고 함

이 코드에서 보듯이 iterable에 Symbol.iterator가 있고 , 이걸 실행하면 value-done을 가진 객체를 리턴하는 next가 있는데

진짜 Iterator에는 또 

let a = arr[Symbol.iterator]() -> let b = arr[Symbol.iterator]() // b.next() 랑 a.next랑 똑같은게 나옴

왜냐면 a === b 이기 때문

그래서 이걸 구현해주려면 return값에 또 [Symbol.iterator]를 넣어서 자기자신(this)를 리턴하는걸 넣어줘야됨

또 a.next()라는 코드를 먼저 쓰고 for (let i of arr) 하면 for문에서는 2~5까지밖에 안돔 - 이것도 구현되여야함

*틀린거 많을테니까 그냥 이런 개념이 있다 정도만

*이런 프로토콜을 통해서 다른 외부 라이브러리나 web api나 dom에서도 활용이 가능하다고 함

ex)nodeList의 경우에도 배열이 아님에도 Symbol.iterator 있고 이 값 안에 next 메서드가 있어서 순회 가능

 

 

정리 - iterable이란 ? able이니깐 iterator 가지고 있음

iterator란? value-done 객체 리턴하는 next라는 매서드를 가지고 있는 오브젝트