[Коллекции] Итератор в JavaScript: что это такое и как использовать

JavaScript [Коллекции] Итератор в JavaScript: что это такое и как использовать


Итератор - это объект в JavaScript, который обеспечивает последовательный доступ к элементам коллекции.

В этой статье мы рассмотрим, что такое итераторы, как использовать их на разных типах коллекций, и как итераторы помогают упростить код и сделать его более читабельным.

Что такое итераторы?

Итераторы - это объекты, которые возвращают последовательные значения из коллекции. Они предоставляют метод next(), который возвращает следующий элемент коллекции и свойство done, которое указывает, достигнут ли конец коллекции.

Итераторы используются в цикле for...of, чтобы перебирать элементы коллекции. Цикл for...of автоматически вызывает метод next() для каждого элемента коллекции и останавливается, когда свойство done возвращаемого объекта установлено в true.

Пример использования итератора на массиве

Давайте рассмотрим пример использования итератора на массиве:

index.js
const arr = [1, 2, 3];
const iter = arr[Symbol.iterator]();

for (const item of iter) {
  console.log(item);
}

Здесь мы создаем итератор для массива arr с помощью метода Symbol.iterator(). Затем мы используем цикл for...of, чтобы перебрать элементы массива. Каждый элемент выводится в консоль.

Пример использования итератора на строке

Итераторы могут быть использованы и на строках. Рассмотрим следующий пример:

index.js
const str = "hello";
const iter = str[Symbol.iterator]();

let result = iter.next();
while (!result.done) {
  console.log(result.value);
  result = iter.next();
}

Здесь мы создаем итератор для строки str, используя метод Symbol.iterator(). Затем мы используем цикл while, чтобы перебрать каждый символ строки. Каждый символ выводится в консоль.

Пример использования итератора на объекте

Итераторы также могут быть использованы на объектах. Рассмотрим следующий пример:

index.js
const obj = { a: 1, b: 2, c: 3 };
const iter = Object.values(obj)[Symbol.iterator]();

for (const item of iter) {
  console.log(item);
}

Здесь мы создаем итератор для значений объекта obj с помощью метода Object.values(). Затем мы используем цикл for...of, чтобы перебрать каждое значение объекта. Каждое значение выводится в консоль.

Использование итераторов для создания собственных коллекций

Мы также можем создать собственные коллекции, которые поддерживают итераторы, чтобы использовать их в цикле for...of.

Для этого нам нужно определить метод Symbol.iterator() в нашей коллекции. Этот метод должен возвращать объект-итератор.

Рассмотрим пример создания собственной коллекции:

index.js
const myCollection = {
  items: [1, 2, 3],
  [Symbol.iterator]() {
    let index = 0;

    return {
      next: () => {
        if (index < this.items.length) {
          return { value: this.items[index++], done: false };
        } else {
          return { done: true };
        }
      }
    };
  }
};

for (const item of myCollection) {
  console.log(item);
}

Здесь мы создаем объект myCollection, который имеет свойство items, содержащее массив элементов. Мы также определяем метод Symbol.iterator(), который возвращает объект-итератор.

Объект-итератор содержит переменную index, которая указывает на текущий элемент в массиве. Метод next() увеличивает index и возвращает объект со следующим элементом в массиве и свойством done.

Затем мы используем цикл for...of, чтобы перебрать элементы нашей собственной коллекции.

Заключение

Итераторы предоставляют удобный способ получения последовательных значений из коллекций. Они могут быть использованы на разных типах коллекций, включая массивы, строки и объекты.

Мы также можем использовать итераторы для создания собственных коллекций, которые могут быть перебраны с помощью цикла for...of.

Итераторы упрощают код и делают его более читабельным, что делает их полезными инструментами в разработке JavaScript.