[Javascript] 이터레이터, 제너레이터
이터레이션 프로토콜
일종의 약속인데 이 약속을 잘 지키는 데이터 컬렉션(객체, 배열 ...)은 for...of문으로 순회할 수 있고 spread문법을 적용할 수도 있다.
종류로 이터러블 프로토콜과 이터레이터 프로토콜이 있다.
- 이터러블 프로토콜
이터러블 프로토콜을 준수한 객체를 이터러블이라고 한며 이러한 이터러블은 Symbol.iterator 메소드(이터레이터를 반환)를 구현하거나 프로토타입 체인에 의해 상속한 객체를 말한다. 이러한 이터러블은 for...of문과 spread 연산자의 대상으로 사용 가능하다.
- 배열은 Symbol.iterator 메소드를 소유하고 있고 일반 객체는 소유하고 있지 않다. 하지만 객체도 이터러블 프로토콜을 준수한다면 이터러블이 되며 이러한 방법으로 커스텀 이터러블이 있다.
- 이터레이터 프로토콜
next 메소드를 소유하며 메소드 호출 시 이터러블을 순회하며 value, done 프로퍼티를 갖는 객체를 반환하며 이 프로토콜을 준수한 객체가 이터레이터이다.
- 앞서 설명한 이터러블 프로토콜을 준수한 이터러블에서 Symbol.iterator 메소드를 호출하면 이터레이터를 반환하고 이 이터레이터는 next 메서드를 소유한다.
// 배열은 이터러블 프로토콜을 준수한 이터러블이다.
const array = [1, 2, 3];
// Symbol.iterator 메소드는 이터레이터를 반환한다.
const iterator = array[Symbol.iterator]();
// 이터레이터 프로토콜을 준수한 이터레이터는 next 메소드를 갖는다.
console.log('next' in iterator); // true
// 이터레이터의 next 메소드를 호출하면 value, done 프로퍼티를 갖는 이터레이터 리절트 객체를 반환한다.
let iteratorResult = iterator.next();
console.log(iteratorResult); // {value: 1, done: false}
이터러블과 이터레이터는 다른 개념임
예시) 이터레이터는 이터러블한 배열에 의해서 생성될 수 있어며 배열의 Symbol.iterator 사용해서 반환되는 것이 이터레이터이기에 이터러블한 객체라고 바로 next() 메서드를 슬 수 있는 것이 아니다
이터레이터 리절트
이터레이터의 next 메서드가 반환하는 객체이며 제너레이터와 동일하게 value와 done 두개의 프로퍼티를 가진 객체이다.
제너레이터
일반 함수는 하나의 값 혹은 0개의 값을 반환한다 하지만 우리는 필요에 따라 여러개의 값을 하나씩 반환하고 싶을 때가 있고 이때 제너레이터가 사용된다.
제너레이터 함수)
제너레이터를 만들기위한 특별한 문법 구조 (function*)
function* generateSequence() {
yield 1;
yield 2;
return 3;
}
let generator = generateSequence();
alert(generator); // [object Generator]위와 같이 제너레이터 함수는 일반 함수와는 반환하는 값이 다르다.
어떻게 하면 원하는대로 하나씩 반환받을 수 있을까?
next()는 제너레이터의 주요 메서드로 호출 시 가장 가까운 yield를 만날때까지 실행이 지속되고 yeild를 만나면 실행이 멈추고 산출하고자 하는 값인 value가 반환된다.
function* generateSequence() {
yield 1;
yield 2;
return 3;
}
let generator = generateSequence();
let one = generator.next();
alert(JSON.stringify(one)); // {value: 1, done: false}
// next()는 항상 value, done을 가진 객체를 반환한다
return문까지도 지나게되면 함수가 종료되는데 이후에는 호출을 하더라도 아무 소용 없다.
이러한 next() 메서드를 가지고 있는 제너레이터는 이터러블이기에 for...or와 spread를 사용할 수 있다
레퍼런스
https://poiemaweb.com/es6-iteration-for-of