---
title: "How to define an iterable object in JavaScript?"  
description: "How to define an iterable object in JavaScript?"  
author: "Steilla Mitchel"  
published: 2023-11-01  
updated: 2023-11-02  
canonical: https://www.mindstick.com/forum/160373/how-to-define-an-iterable-object-in-javascript  
category: "javascript"  
tags: ["javascript", "iterable"]  
reading_time: 2 minutes  

---

# How to define an iterable object in JavaScript?

How to [define](https://yourviews.mindstick.com/audio/1110/lifestyles-choices-that-define-our-lives) an iterable object in [JavaScript](https://www.mindstick.com/articles/874/how-to-create-watermark-text-for-textbox-by-using-javascript)?

## Replies

### Reply by Aryan Kumar

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:

```plaintext
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.


---

Original Source: https://www.mindstick.com/forum/160373/how-to-define-an-iterable-object-in-javascript

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.