Iteration protocols?

Parker.Park·2022년 7월 8일
0

개념

목록 보기
4/16

Iteration protocols?

Iteration protocols는 ECMAScript 2015(ES6)에서 추가된 protocols 이다. 데이터 컬렉션을 순회하기 위한 규칙으로 볼 수 있다. Iteration protocols에는 두 가지 protocol이 있다고 한다.

  • Iterable protocol
  • Iterator protocol

Iterable protocol

Iterable protocol을 준수한 객체를 Iterable이라고 한다. IterableSymbol.iterator메소드를 구현 하거나, 프로토타입 체인에 의해 상속한 객체를 의미한다고 한다. Symbol.iterator 메소드는 Iterator을 반환한다고 한다.

let arr = [1, 2, 3]

console.log(Symbol.iterator in arr) //true

Iterator protocol

Iterator protocol은 next 메소드를 소유하고 있으며, 이터러블을 순회 하며 value, done 프로퍼티를 갖는 객체를 반환한다고 한다.
정리하자면 Iterable protocol을 준수한 객체를 Iterable이라고 하며, IterableSymbol.iterator 메소드를 호출하여 Iterator를 생성하고, Iterator는 next 메소드를 갖으며, next 메소드를 호출하면 value와 done 프로퍼티를 갖는 iterator result 객체를 반환한다고 한다.

let arr = [1, 2, 3]

let abc = arr[Symbol.iterator]()

console.log('next' in abc) //true

console.log(abc.next()) //{ value: 1, done: false }

next 메소드를 호출하면 이터러블을 순차적으로 한 단계씩 순회하며 iterator result 객체를 반환한다고 한다.

let arr = [1, 2, 3]

let abc = arr[Symbol.iterator]()

console.log(abc.next()) //{ value: 1, done: false }
console.log(abc.next()) //{ value: 2, done: false }
console.log(abc.next()) //{ value: 3, done: false }
console.log(abc.next()) //{ value: undefined, done: true }

Built-in iterable

ES6 에서 제공하는 built-in iterable은 다음과 같다.

  • Array
  • String
  • Map
  • Set
  • TypedArray
  • DOM data structure
  • Arguments

iterable이기 때문에 순회 for...of 사용이 가능하다.

function iterator(a, b){
 
  for(let key of arguments){
    console.log(key)
  }
  
}

iterator(10, 20) 
//10
//20

let s = "abc" //String 또한 iterable이다.
let iter = s[Symbol.iterator]()

console.log(iter.next()) //{ value: 'a', done: false }
console.log(iter.next()) //{ value: 'b', done: false }
console.log(iter.next()) //{ value: 'c', done: false }
console.log(iter.next()) //{ value: undefined, done: true }

마치면서

for...of , for...in에서 출발한 벨로그이다. 아직 결말은 없는 가운데...

참조

[Iterable, MDN, 2022년07월07일 접속]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Iteration_protocols#iterable

[이터레이션과 for...of 문, poiemweb, 2022년07월13일 접속]
https://poiemaweb.com/es6-iteration-for-of

profile
개발자준비중

0개의 댓글