정의
ES6 에서 도입된 이터레이션 프로토콜은 데이터 컬렉션을 순회하기 위한 프로토콜이다.
이터레이션 프로토콜에는 이터러블 프로토콜과 이터레이션 프로토콜, 총 2가지의 프로토콜이 있다.
이터러블 프로토콜
이터러블
Symbol.iterator() 메서드를 가지고 있는 객체를 의미한다. Symbol.iterator() 메서드를 직접 구현해서 적용한 객체와 프로토타입을 통해 상속받는 객체 모두 이터러블이다.
array 라는 배열을 생성하고
in 연산자를 통해 Symbol.iterator() 메서드가 존재하는 것을 확인할 수 있고, array 배열을 console.log 를 통해 확인하면 array 배열의 프로토타입인 Array 에 Symbol.iterator() 가 존재하는 것을 확인할 수 있다.내장 이터러블
인자값으로 특정 항목을 전달받아 해당 항목에
Symbol.iterator() 메서드의 존재 여부를 Boolean 값으로 반환하는 isIterable() 이라는 함수를 생성하고 각각의 항목들을 체크해봤다.이터레이터 프로토콜
이터레이터 프로토콜은 객체 안에
next() 메서드가 존재하고 이 next() 메서드가 값을 나타내는 value 와 종료 여부를 나타내는 done 프로퍼티를 가진 이터레이터 리절트(iterator result) 객체를 반환하는 규칙을 가진다.위의 코드처럼
arr 이라는 배열을 생성하고 arrIter 라는 변수에 arr 의 이터레이터를 할당한 다음, next() 메서드를 통해 순차적으로 실행을 하게 되면 value 와 done 프로퍼티를 가진 이터레이터 리절트(iterator result) 가 생성되는 것을 확인할 수 있다. 첫 번째 호출부터 다섯 번째 호출까지는
value 의 값에 arr 배열의 값이 적용되고 done 값에 false 가 적용되지만 다섯 번째 이후부터는 더 이상 반환할 값이 없기 때문에 value 값에 undefined 가 적용되고 done 값에 true 값이 적용된다.이터러블의 특징
for…of문을 통해 순회가 가능하다.
- 전개 구문(spread syntax) 을 적용할 수 있다.
- 구조 분해 할당(destructuring assignment) 을 적용할 수 있다.
Array.from()메서드를 사용할 수 있다.
커스텀 이터러블
커스텀 이터러블을 생성하는 방식에는 일반 객체에
Symbol.iterator() 메서드를 추가해서 생성하는 방법과 제너레이터(Generator) 함수를 통해 생성하는 방식이 있다. 코드를 통해서 이전 값과 현재값을 더해나가는 피보나치 수열을 예를 들어서 2가지 방식을 구현해보려고 한다.먼저 일반 객체에
Symbol.iterator() 메서드를 추가해서 생성하는 코드를 작성하였다.인자값으로
max 라는 최댓값을 받는 fibonacchi() 함수를 생성한 다음, 그 안에 next() 메서드를 반환하는 Symbol.iterator() 메서드를 생성하여 반환시켜주었다. 그리고
fiboIterator 라는 변수를 통해 이터레이터를 생성하고 next() 메서드를 호출하면 기존의 이터러블처럼 정상적으로 동작하는 것을 확인할 수 있다.그다음으로 제너레이터(Generator) 함수를 통해 생성하는 코드를 작성하였다.
function 키워드 뒤에 * 을 추가하여 제너레이터 함수 fibonacchi() 를 생성한 다음, 인자값으로 max 값을 전달받는다. 그리고 while 문 안에 yield 키워드를 통해 값을 반환하도록 하였다.fibo 라는 변수에 fibonacchi() 함수의 반환 값을 할당하고 fibo.next() 를 호출하면 정상적으로 이터러블 리절트 객체가 반환되는 것을 확인할 수 있다.이렇게 이터레이션 프로토콜에 대해서 정리를 해봤는데 간단하게 알고 있던
Map 과 Set 에 대해서 더 자세하게 정리해야겠다는 생각이 들었다.참고
