next() в JavaScript

• Что такое next()
• value и done
• Порядок вызовов
• Связь с for…of
• Простой итератор вручную
• Итого

next() - это метод итератора. Он возвращает следующее значение при переборе.

Важно: next() вызывают не у массива и не у строки напрямую, а у итератора, который можно получить через Symbol.iterator.

let numbers = [10, 20, 30];
let iterator = numbers[Symbol.iterator]();

console.log(iterator.next());

Результат:

{ value: 10, done: false }

Итератор вернул первое значение массива.

Что такое next()

Метод next() делает один шаг по итерируемому объекту.

Один вызов next() - одно следующее значение.

let word = 'JS';
let iterator = word[Symbol.iterator]();

console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());

Результат:

{ value: 'J', done: false }
{ value: 'S', done: false }
{ value: undefined, done: true }

Сначала итератор отдал букву ‘J’, потом ‘S’. После этого значения закончились.

value и done

Метод next() возвращает объект с двумя важными свойствами:

value - текущее значение.

done - признак завершения перебора.

let numbers = [5, 10];
let iterator = numbers[Symbol.iterator]();

let result = iterator.next();

console.log(result.value);
console.log(result.done);

Результат:

5
false

Пока done равно false, значение можно брать из value. Когда done станет true, перебор закончен.

Порядок вызовов

Итератор запоминает, где он остановился. Каждый следующий вызов next() двигает его дальше.

let colors = ['red', 'green', 'blue'];
let iterator = colors[Symbol.iterator]();

console.log(iterator.next().value);
console.log(iterator.next().value);
console.log(iterator.next().value);

Результат:

red
green
blue

Итератор не начинает перебор заново после каждого вызова. Он идет вперед.

Если нужен новый проход с начала, нужно создать новый итератор.

let numbers = [1, 2];

let firstIterator = numbers[Symbol.iterator]();
let secondIterator = numbers[Symbol.iterator]();

console.log(firstIterator.next().value);
console.log(secondIterator.next().value);

Результат:

1
1

Связь с for…of

Цикл for…of делает примерно ту же работу, только скрывает детали.

let numbers = [10, 20, 30];

for (let number of numbers) {
  console.log(number);
}

Если представить это упрощенно, JavaScript получает итератор и вызывает next(), пока done не станет true.

let numbers = [10, 20, 30];
let iterator = numbers[Symbol.iterator]();

let result = iterator.next();

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

Результат:

10
20
30

В обычном коде чаще пишут for…of. Ручной вызов next() нужен в основном для понимания механики или в более специальных задачах.

Простой итератор вручную

Итератор - это объект, у которого есть метод next().

let counter = {
  current: 1,

  next() {
    if (this.current <= 3) {
      return { value: this.current++, done: false };
    }

    return { value: undefined, done: true };
  }
};

console.log(counter.next());
console.log(counter.next());
console.log(counter.next());
console.log(counter.next());

Результат:

{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }

Такой объект уже умеет отдавать значения по одному. Но для работы с for…of ему еще нужен метод Symbol.iterator.

Итого

1. next() - это метод итератора.

2. Один вызов next() возвращает одно следующее значение.

3. Метод next() возвращает объект со свойствами value и done.

4. Если done равно true, перебор завершен.

5. for…of использует этот механизм внутри, но обычно скрывает его от нас.