Значення, що повертає генератор

JavaScriptMiddle~1 хв читання

Коротка відповідь:

Виклик функції-генератора (function*) не запускає її код одразу.

Він повертає об'єкт-генератор, який є ітератором і керує виконанням цієї функції.

Приклад

javascript

function* gen() {
  yield 1;
  yield 2;
  yield 3;
}

const iterator = gen(); // повертається об'єкт-генератор

console.log(iterator); // Object [Generator] {}

Об'єкт iterator - це не результат функції, а контролер, який дозволяє "покроково" виконувати генератор через .next(), .throw(), .return().

Що вміє об'єкт-генератор

Генератор реалізує два протоколи:

Протокол ітератора (next(), done, value);
Протокол ітерованого об'єкта ([Symbol.iterator]()).

Приклад роботи з `.next()`

javascript

function* gen() {
  yield 'A';
  yield 'B';
}

const it = gen();

console.log(it.next()); // { value: 'A', done: false }
console.log(it.next()); // { value: 'B', done: false }
console.log(it.next()); // { value: undefined, done: true }

Кожен виклик .next():

запускає генератор (якщо він "заморожений");
виконує його до наступного yield або return;
повертає об'єкт { value, done }.

Генератор - це ітератор

Генератор можна використовувати в for...of, spread, Array.from та інших ітераціях:

javascript

function* gen() {
  yield 1;
  yield 2;
  yield 3;
}

const iterator = gen();

for (const n of iterator) {
  console.log(n);
}

Виведення:

javascript

1
2
3

Об'єкт-генератор містить 3 методи

Метод	Що робить
`.next(value)`	Відновлює виконання до наступного `yield`; повертає `{ value, done }`
`.throw(error)`	Кидає виняток всередину генератора (ловиться через `try/catch`)
`.return(value)`	Завершує генератор і повертає `{ value, done: true }`

Генератор ≠ результат функції

Важливо розуміти:

javascript

function* numbers() {
  yield 1;
  yield 2;
}

const result = numbers(); // повертає не [1,2], а об'єкт-генератор

Щоб отримати реальні значення, потрібно "обійти" генератор:

javascript

console.log([...numbers()]); // [1, 2]

або вручну викликати .next() кілька разів.

Візуально:

javascript

┌────────────────────┐
│ function* numbers()│
│ { yield 1; yield 2;}│
└────────┬───────────┘
         │ виклик
         ▼
 ┌───────────────────────────────┐
 │ Object [Generator]            │
 │ ├── next()                    │
 │ ├── throw()                   │
 │ ├── return()                  │
 │ └── [Symbol.iterator]()       │
 └───────────────────────────────┘

Підсумок

Що повертає генератор	Об'єкт-генератор
Запускається одразу?	Ні
Можна керувати виконанням?	Так, через `.next()`
Реалізує протокол ітератора?	Так
Повертає значення?	Через `yield`
Можна використовувати в `for...of`	Так
Повертає кінцеве значення	Через `return` або `done: true`

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.