JavaScript
Explica cómo las funciones generadoras pausan y reanudan su ejecución con yield, delegan iterables y producen secuencias perezosas con estado propio.
Una función generadora puede pausar su ejecución con yield y continuar más adelante desde el mismo punto.
function* createIds() {
yield 1;
yield 2;
yield 3;
}Llamarla no ejecuta todavía su cuerpo. Crea un objeto generator, que es un iterador.
const ids = createIds();function* createIds() {
yield 1;
}Es la definición reutilizable.
const ids = createIds();Es una ejecución concreta con su propio estado y progreso.
const first = createIds();
const second = createIds();Cada llamada crea un objeto independiente.
function* example() {
console.log("Started");
yield 1;
}
const generator = example();Todavía no se imprime nada.
generator.next();
// Imprime "Started".La primera llamada a next inicia la ejecución y avanza hasta el primer yield, return o final de la función.
function* createValues() {
yield "A";
yield "B";
}Cada yield:
next.const values = createValues();
values.next();
// { value: "A", done: false }
values.next();
// { value: "B", done: false }
values.next();
// { value: undefined, done: true }function* counter() {
let value = 0;
while (value < 3) {
yield value;
value++;
}
}const sequence = counter();
sequence.next(); // 0
sequence.next(); // 1
sequence.next(); // 2La variable value mantiene su estado entre pausas.
function* example() {
yield 1;
return 99;
}const generator = example();
generator.next();
// { value: 1, done: false }
generator.next();
// { value: 99, done: true }El valor de return aparece en el registro final de next, pero for...of no lo incluye.
[...example()]; // [1]yield produce elementos de la secuencia; return termina la ejecución.
const generator = createValues();
generator[Symbol.iterator]() === generator;
// truePor eso funciona con:
for (const value of createValues()) {
console.log(value);
}Y con spread:
[...createValues()];El objeto concreto se consume una sola vez.
const generator = createValues();
[...generator]; // ["A", "B"]
[...generator]; // []La función generadora puede llamarse otra vez para crear otro recorrido.
Una expresión yield también puede recibir el valor enviado al reanudar la ejecución.
function* conversation() {
const name = yield "What is your name?";
return `Hello, ${name}`;
}const chat = conversation();
chat.next();
// { value: "What is your name?", done: false }
chat.next("Nicolás");
// { value: "Hello, Nicolás", done: true }El argumento enviado a next se convierte en el resultado de la expresión yield pausada.
const chat = conversation();
chat.next("Ignored");No existe un yield pausado que pueda recibir ese primer argumento. La primera llamada inicia la función.
Para enviar un valor, primero debes avanzar hasta un yield.
yield* delega en otro iterable.
function* frontend() {
yield "HTML";
yield "CSS";
}
function* stack() {
yield "JavaScript";
yield* frontend();
yield "React";
}[...stack()];
// ["JavaScript", "HTML", "CSS", "React"]También puede delegar a arrays, strings, Sets u otros iterables.
function* values() {
yield* [1, 2, 3];
}function* inner() {
yield 1;
return 99;
}
function* outer() {
const finalValue = yield* inner();
yield finalValue;
}[...outer()]; // [1, 99]yield* produce los valores delegados y su expresión recibe el valor final retornado por el iterador interno.
const generator = createValues();
generator.next();
generator.return("Stopped");Produce una finalización anticipada.
{
value: "Stopped",
done: true,
}Después, el generator permanece cerrado.
function* readValues() {
try {
yield 1;
yield 2;
yield 3;
} finally {
console.log("Cleanup");
}
}Si un for...of termina con break, solicita el cierre del iterador y se ejecuta finally.
for (const value of readValues()) {
if (value === 2) {
break;
}
}
// "Cleanup"Esto permite liberar recursos controlados por la abstracción.
function* task() {
try {
yield "waiting";
} catch (error) {
yield `Recovered: ${error.message}`;
}
}const generator = task();
generator.next();
generator.throw(new Error("Failed"));throw inserta un error en el punto donde la función estaba pausada.
Si no existe un try...catch que lo maneje, el error se propaga y el generator termina.
function* naturalNumbers() {
let number = 0;
while (true) {
yield number++;
}
}La función no construye todos los números. Produce uno por solicitud.
const numbers = naturalNumbers();
numbers.next().value; // 0
numbers.next().value; // 1Pero una secuencia infinita sigue siendo peligrosa si el consumidor intenta terminarla por completo.
[...naturalNumbers()];
// Nunca termina y puede agotar memoria.Tampoco evita automáticamente bloquear el hilo. Un bucle síncrono que solicite valores sin parar seguirá ejecutándose de forma síncrona.
Limita el consumo.
const firstTen = Iterator.from(
naturalNumbers(),
).take(10).toArray();function* range(start, end, step = 1) {
if (step === 0) {
throw new RangeError(
"Step cannot be zero",
);
}
if (step > 0) {
for (
let value = start;
value <= end;
value += step
) {
yield value;
}
return;
}
for (
let value = start;
value >= end;
value += step
) {
yield value;
}
}[...range(1, 5, 2)];
// [1, 3, 5]El generador expresa una secuencia sin crear previamente un array intermedio.
function* walkTree(node) {
yield node;
for (const child of node.children ?? []) {
yield* walkTree(child);
}
}for (const node of walkTree(root)) {
console.log(node.name);
}La recursividad y yield* permiten describir el recorrido de forma incremental.
Para árboles muy profundos, la recursividad todavía puede alcanzar el límite del Call Stack; la pereza no elimina esa profundidad de llamadas.
function* mapIterable(iterable, transform) {
for (const value of iterable) {
yield transform(value);
}
}const doubled = mapIterable(
range(1, 3),
(value) => value * 2,
);
[...doubled]; // [2, 4, 6]Los helpers modernos de Iterator ya proporcionan operaciones como map, filter, take y toArray, pero los generadores siguen siendo útiles para lógica personalizada.
Un generator conserva su contexto de ejecución mientras está pausado.
function createSequence(prefix) {
return function* sequence() {
let index = 1;
while (true) {
yield `${prefix}-${index++}`;
}
};
}La función generadora creada conserva prefix mediante closure; cada objeto generator conserva además su propio index.
function* heavyWork() {
while (true) {
yield expensiveSynchronousCalculation();
}
}Cada next() ejecuta el trabajo en el hilo actual hasta llegar al siguiente yield.
Un generator organiza la pausa cooperativa; no crea otro hilo, no paraleliza y no delega automáticamente el trabajo al Event Loop.
async function* readPages() {
let page = 1;
while (true) {
const response = await fetchPage(page);
if (response.items.length === 0) {
return;
}
yield response.items;
page++;
}
}Se consumen con:
for await (const items of readPages()) {
render(items);
}Un async generator produce un iterador asíncrono: sus operaciones next retornan promesas.
Se profundizará junto con for await...of, streams y asincronía.
function* readFileLines(reader) {
try {
while (true) {
const line = reader.readLine();
if (line === null) {
return;
}
yield line;
}
} finally {
reader.close();
}
}Mientras el generator permanezca pausado y accesible, también puede mantener accesibles sus variables y recursos.
El consumidor debe terminarlo o permitir que deje de ser accesible. Para recursos críticos, diseña limpieza explícita con return, finally o APIs de disposición.
function* chunk(items, size) {
if (!Number.isInteger(size) || size <= 0) {
throw new RangeError(
"Chunk size must be positive",
);
}
for (
let index = 0;
index < items.length;
index += size
) {
yield items.slice(index, index + size);
}
}for (const batch of chunk(products, 100)) {
await saveBatch(batch);
}La producción de lotes es síncrona; el consumidor decide esperar cada operación asíncrona.
yield termina la función como return.next y esperar recibirlo dentro.return aparece en for...of.yield* solo funciona con otros generadores.function* define una función generadora.next avanza hasta el siguiente yield.next(value) envía un valor al yield pausado.yield* delega en cualquier iterable.return y throw permiten terminar o inyectar errores desde el consumidor.finally permite limpieza ante cierre anticipado.¿Qué valores devuelve cada llamada?
function* example() {
const value = yield "A";
return value;
}
const generator = example();
generator.next("ignored");
generator.next("B");La primera llamada devuelve { value: "A", done: false }; su argumento se ignora porque todavía no había un yield pausado. La segunda envía "B" al yield y devuelve { value: "B", done: true } por el return.
TypedArrays y datos binarios explica cómo JavaScript representa bytes y valores numéricos dentro de buffers de memoria.