Iterables & Iterators in Javascript

While arrays, ‘for loops,’ and ‘while loops’ are well-known concepts, iterators offer a more versatile approach to traversing collections. An iterator represents a collection that can be iterated through systematically. In comparison, an array can be viewed as an extended iterator, equipped with convenient methods to manage and manipulate its elements.

Chain of boxes generated by Bing Dall-E

This is the first article in a series of upcoming articles related to iterators and their use cases in Javascript. Share it for free using this link!

What is an iterator?

In JavaScript, an iterator is an object that provides a way to iterate over a sequence of values, one at a time until the iterator has reached its end.

All variations of iterators implementing the iterator protocol must feature a next() method. This method returns an object with two properties, value and done. If done is true, there is no value defined, marking the completion of the iterator.

The simplest way to understand the working of an iterator is to invoke the values() method on an array of numbers. This method returns the iterator specific to that particular collection, providing a clear illustration of how the iterator operates.

const iterator = [1, 2, 3].values()

iterator.next() // { value: 1, done: false }…