How to define an iterable object in JavaScript?

Question

Aryan Kumar · Answer

To define an iterable object in JavaScript, you need to implement the iterator protocol, which involves adding a Symbol.iterator method to your object. This method should return an iterator object with a next() method. Here's a step-by-step guide to creating an iterable object:

Create Your Iterable Object: Start by defining an object that you want to make iterable. This object should contain the data or elements you want to iterate over.

Implement the Symbol.iterator Method: Add a method named Symbol.iterator to your object. This method should return an iterator object.

Define the Iterator Object: Within the Symbol.iterator method, create and return an iterator object. The iterator object should have a next() method.

Implement the Iterator's next() Method: Inside the iterator object's next() method, define the logic for iterating over the elements in your iterable object. The next() method should return an object with two properties: value (the current value) and done (a boolean indicating whether the iteration is complete).

Here's an example of how to define an iterable object:

const myIterable = {
  data: [1, 2, 3, 4],
  index: 0,

  [Symbol.iterator]: function () {
    const self = this;

    return {
      next: function () {
        if (self.index < self.data.length) {
          return { value: self.data[self.index++], done: false };
        } else {
          return { value: undefined, done: true };
        }
      },
    };
  },
};

// Now you can iterate over myIterable using a for...of loop or manually.
for (const item of myIterable) {
  console.log(item);
}

In this example, myIterable is an object that contains an array (data) and an index. It implements the iterator protocol by defining a Symbol.iterator method that returns an iterator object. The iterator object has a next() method, which tracks the iteration progress.

You can use the for...of loop or manually call the iterator's next() method to iterate over the elements of the myIterable object.

forum

How to define an iterable object in JavaScript?

Can you answer this question?

1 Answers