Iterator Pattern
Structural: Iterator Pattern
Can you explain the iterator design pattern?
View Answer:
Interview Response: The Iterator Pattern allows you to progressively access and explores elements of an aggregate object (collection) without exposing its underlying representation. This technique enables JavaScript writers to create significantly more versatile and sophisticated looping constructs. Iterators and Generators got introduced in ES6, which aids in implementing the Iteration pattern.
Code Example #1:

Code Example #2:

The objects participating in this pattern are:
Client -- In example code: the run() function
- references and invokes Iterator with a collection of objects
Iterator -- In example code: Iterator
- implements Iterator interface with methods first(), next(), etc
- keeps track of the current position when traversing the collection
Items -- In example code: Items
- individual objects of the collection getting traversed
let Iterator = function (items) {
this.index = 0;
this.items = items;
};
Iterator.prototype = {
first: function () {
this.reset();
return this.next();
},
next: function () {
return this.items[this.index++];
},
hasNext: function () {
return this.index <= this.items.length;
},
reset: function () {
this.index = 0;
},
each: function (callback) {
for (let item = this.first(); this.hasNext(); item = this.next()) {
callback(item);
}
},
};
function run() {
let items = ['one', 2, 'circle', true, 'Applepie'];
let iter = new Iterator(items);
// using for loop
for (let item = iter.first(); iter.hasNext(); item = iter.next()) {
console.log(item);
}
console.log('');
// using Iterator's each method
iter.each(function (item) {
console.log(item);
});
}
run();
/*
OUTPUT:
one
2
circle
true
Applepie
one
2
circle
true
Applepie
*/
const items = [1, 'hello', false, 99.8];
function Iterator(items) {
this.items = items;
this.index = 0; // to start from beginning position of array
}
Iterator.prototype = {
// returns true if a next element is available
hasNext: function () {
return this.index < this.items.length;
},
//returns next element
next: function () {
return this.items[this.index++];
},
};
//Instantiate object for Iterator
const iterator = new Iterator(items);
while (iterator.hasNext()) {
console.log(iterator.next());
}
/*
OUTPUT
1
hello
false
99.8
*/
The Iterator pattern belongs to which pattern category?
View Answer:
Interview Response: The Iterator pattern is a type of behavioral design pattern.
When should you utilize JavaScript's Iterator Pattern?
View Answer:
Interview Response: This pattern helps deal with iteration-related challenges, constructing flexible looping constructs, and retrieving items from a complex collection without knowing the underlying representation. We can use it to create a generic iterator that efficiently explores any collection regardless of its type.
What are some of the benefits of using the Iterator pattern?
View Answer:
Interview Response: Benefits of the Iterator Pattern
- Singular Responsibility Principle By separating cumbersome traversal algorithms into different classes, you may clean up the client code and collections.
- The Open/Closed Principle -- You can add new types of collections and iterators to existing code without affecting anything.
- Because each iterator object maintains its iteration state, you can concurrently iterate over the same collection.
- For the same reason, you can postpone an iteration and resume it later.
What are some of the Iterator pattern's drawbacks?
View Answer:
Interview Response: Drawbacks of the Iterator Pattern.
- Using the pattern may be overkill if your software works with simple collections.
- Using an iterator may be less productive than going over elements of specific specialized collections directly.