JavaScript에서의 반복자 호출

반복자를 연속적으로 호출할 때마다 특별한 구조의 객체를 반환해야 합니다. 이 구조를 살펴보겠습니다. 다음과 같은 배열이 있다고 가정해 봅시다:

let arr = [1, 2, 3];

배열의 반복자를 변수에 저장하겠습니다:

let iter = arr[Symbol.iterator]();

이제 이 변수에는 next 메서드를 가진 객체가 들어 있습니다. 이 메서드는 요소의 값을 포함하는 value 키와, 순회가 끝났는지 여부에 대한 정보를 포함하는 done 키를 가진 객체를 반환합니다:

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

next 메서드를 연속적으로 호출하면 매번 다음 요소를 반환합니다:

console.log( iter.next() ); // {value: 1, done: false}
console.log( iter.next() ); // {value: 2, done: false}
console.log( iter.next() ); // {value: 3, done: false}

요소가 모두 소진되면, 다음 값들을 볼 수 있습니다:

console.log( iter.next() ); // {value: undefined, done: true}

Map 컬렉션의 반복자를 얻으세요. 컬렉션의 요소가 모두 소진될 때까지 연속적으로 호출해 보세요.

NodeList 컬렉션의 반복자를 얻으세요. 컬렉션의 요소가 모두 소진될 때까지 연속적으로 호출해 보세요.

HTMLCollection 컬렉션의 반복자를 얻으세요. 컬렉션의 요소가 모두 소진될 때까지 연속적으로 호출해 보세요.