Javscript Iteration protocol

Javascript는 ES6에서 Iteration protocol이 추가되었습니다. Iterable protocol는 JavaScript 객체를 for..in 와 같은 구문에서 어떠한 값이 반복되는 지와 같은 행위를 정의하거나 커스텀마이즈 할 수 있습니다. 이렇게되서 반복 할 수 있는 객체를 iterable이다.라고 하는데요. iterable 하다는건 무엇일까요?

Iterable Protocol

Iterable하다는건 객체는 반드시 @@iterator method를 가져야합니다. 이는 객체의 속성에 Symbol.iterator를 가져아하고 값으로는 object를 반환하고 Iterator protocol를 만족해야합니다.

es6에 기본적으로 내장된 생성자 중 Iterable 객체를 만들어내는, 즉 Symbol.iterator를 속성으로 가진 것들입니다. (default Built-in iterables)

• String
• Array
• TypedArray
• Map
• Set

즉 terable 객체는 Symbol.iterator 속성이 존재하고 이 속성에 Iterator protocol를 만족하는 함수를 가지고 있는 객체입니다. 그렇다면 iterator protocol은 무엇일까요?

Iterator Protocol

Iterator 객체는 무엇일까요? 객체가 next() 메소드를 가지고 있어야하며 구현 방식은 아래와 같아야 합니다.

• next 메소드는 다음 두 속성을 갖는 객체를 반환해야 합니다.
  • done - 반복이 모두 끝났다면 true, 아니면 false
  • value - Iterator(반복자)으로부터 반환되는 값 (done이 true일 경우 생략 될 수 있음)

즉 Iterator 객체는 next() 메소드를 가지고 있고 위와 같은 규약으로 구현되있어야 합니다.

Iteration protocol 예시

// 문자열은 iterable이므로 이로부터 iterator를 생성할 수 있습니다.
const strIterator = 'go'[Symbol.iterator]();
strIterator.next(); // { value: 'g', done: false }
strIterator.next(); // { value: 'o', done: false }
strIterator.next(); // { value: undefined, done: true }
strIterator.next(); // { value: undefined, done: true }

앞서 자바스크립트에서 string은 iterable 객체라고 했는데요. 당연히 iterable 객체이므로 Symbol.iterator 속성에 iterator 함수가 존재합니다. strIterator으로 iterator를 할당해준 모습을 확인 할 수 있습니다. strIterator는 iterator 객체이므로 next()라는 메소드를 가지고 있습니다. 이 메소드를 통해서 순회 할 수 있는데요. Iterator Protocol의 next()의 규약와 같이 value와 done을 리턴하는 모습을 확인 하실 수 있습니다.

Refs

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#built-in_iterables