[ES6 정리] 11. 이터러블, 이터레이터

이터러블 : 이터레이터를 리턴하는 [Symbol.interator]() 를 가진 값

이터레이터 : { value, done } 객체를 리턴하는 next() 를 가진 값

이터러블/이터레이터 프로토콜 : 이터러블을 for...of, 전개 연산자 등과 함께 동작하도록 한 규약

 

이터러블/이터레이터 프로토콜을 따르는? for of, rest, spread 등이 어떻게 동작하는지 이터러블 이터레이터를 통해서 알수가 있다

<script>
    console.log(`Arr ---------`)
    const arr = [1, 2, 3];
    for (const a of arr) console.log(a);
</script>

위와 같은 코드에서 for of 문을 돌렸을 때 결과값은 1 2 3이 출력이 된다. 그동안은 for문을 쓰니까 뭐 당연히 저렇게 나오겠거니 했지만 어떤 프로세스를 통해 저 결과값이 나오는지 이터러블/이터레이터 프로토콜을 통해 알수 있다

ES6에 추가된 Symbol은 어떤 객체의 key로 사용될수가 있다. Symbol을 이용해 arr에 어떤 이터레이터가 존재하는지 확인해보면 특정 함수가 들어있음을 볼수 있다. 

for문은 반복문이기에 값을 출력하고 돌아와서 다음 값을 다시 출력하는 방식이라 아까 선언한 iterator를 next()로 값을 넘기면 순서대로 값이 출력되고, done의 값이 true가 되면 더이상 출력할 value가 없기 때문에 value값은 undifined이 된다.