Contenido del curso
Configuracion
¿Qué se implementó en ES6?
- 4

let, const y arrow functions en ES6
15:29 min - 5

Template literals en JavaScript ES6
08:11 min - 6

Parámetros por defecto en funciones ES6
05:46 min - 7

Desestructuración de arrays y objetos en JavaScript
05:33 min - 8

Spread y rest parameters en JavaScript
07:30 min - 9

Playground: Combina objetos JSON con el Spread Operator
- 10

Object literals abreviados en ES6
05:42 min - 11

Promesas en JavaScript con resolve y reject
08:09 min - 12

Clases en JavaScript con getters y setters
18:54 min - 13

Módulos en JavaScript con import y export
09:48 min - 14

Playground: Obtén una lista de películas
- 15

Generators en JavaScript: control del estado
Viendo ahora - 16

Playground: Generador de identificadores para michis
- 17

Método add() y encadenamiento en Sets JS
04:36 min
¿Qué se implementó en ES7?
¿Qué se implementó en ES8?
¿Qué se implementó en ES9?
¿Qué se implementó en ES10?
¿Qué se implementó en ES11?
¿Qué se implementó en ES12?
¿Qué se implementó en ES13?
Recapitulación
Generators en JavaScript: control del estado
Resumen
Los generators de ECMAScript 6 son un tipo especial de función que retorna una serie de valores siguiendo un algoritmo definido y, lo más interesante, recuerdan su estado entre ejecuciones. Si trabajas con JavaScript y quieres iteradores personalizados sin escribir lógica compleja, esta herramienta te va a ahorrar líneas y dolores de cabeza.
¿Qué es un generator en JavaScript y para qué sirve?
Un generator es una función que pausa su ejecución, entrega un valor y guarda el punto exacto donde se quedó para continuar la próxima vez que la llames. Eso es lo que la documentación describe como un iterador personalizado [01:00].
¿Qué hace especial a un generator? Mantiene su estado interno entre llamadas. No necesitas índices ni variables auxiliares: tú pides el siguiente valor con
next()y la función recuerda dónde se había quedado.
Esta capacidad de mantener el estado es la diferencia clave frente a una función normal, que siempre arranca desde cero.
¿Cómo se declara un generator con function asterisco?
La sintaxis tiene una pista visual muy clara: un asterisco junto a la palabra function. Ese símbolo le indica a JavaScript que estás creando un generator y no una función tradicional [02:30].
Dentro del cuerpo aparece otra palabra reservada: yield. Esta es la encargada de devolver cada valor en la secuencia y de pausar la función hasta la próxima llamada.
javascript function* iterate(array) { for (let value of array) { yield value; } }
Aquí pasas un array como argumento, recorres cada elemento con un for...of y entregas el valor con yield. Simple, pero potente.
¿Qué papel cumple yield dentro del algoritmo?
yield es el punto de pausa. Cada vez que la función llega a esa línea, devuelve el valor indicado y congela su contexto. Cuando vuelves a invocar next(), la ejecución continúa justo después del último yield, no desde el inicio.
Eso convierte al generator en una herramienta ideal para algoritmos iterativos que necesitan emitir valores bajo demanda.
¿Cómo se ejecuta un generator con el método next?
Para usar el generator, primero creas una instancia llamando a la función con tus datos. Después accedes a los valores con next(), que devuelve un objeto con la propiedad value [04:15].
javascript const it = iterate(['Óscar', 'David', 'Ana', 'Ulises', 'Jennifer']);
console.log(it.next().value); // Óscar console.log(it.next().value); // David console.log(it.next().value); // Ana
Fíjate en algo importante: nunca le indicas una posición específica del array. No le pides el segundo o el tercer elemento. Solo llamas a next() y el generator entrega el siguiente valor de la serie.
¿Qué devuelve next cuando ya no hay más valores? Devuelve
undefined. Cuando el generator termina de recorrer todos los elementos del array, las llamadas adicionales anext().valueretornanundefinedporque la secuencia ya se agotó.
Esto te da una señal clara de que la iteración terminó y puedes manejarla en tu lógica de aplicación.
¿Por qué cada llamada a next devuelve un valor distinto?
Porque el generator recuerda su estado. La primera ejecución entra al for, toma el primer elemento y lo entrega con yield. La segunda llamada no reinicia el bucle: retoma justo donde se pausó, avanza al siguiente elemento y vuelve a entregar.
Si fuera una función normal, cada llamada empezaría desde cero y siempre te devolvería Óscar. El asterisco y el yield cambian completamente ese comportamiento.
¿Cuándo conviene usar generators en tus aplicaciones?
Los generators brillan cuando necesitas producir secuencias de valores bajo demanda sin cargar todo en memoria de golpe o cuando quieres implementar iteradores personalizados con poca ceremonia.
Algunos casos donde aportan ventaja real:
- Recorrer colecciones grandes entregando un elemento a la vez.
- Construir flujos de datos donde el consumidor decide cuándo pedir el siguiente valor.
- Implementar algoritmos iterativos como secuencias matemáticas o paginaciones.
- Reemplazar lógica compleja de iteradores con funciones más legibles.
La clave está en pensar en flujos en lugar de colecciones completas. Si tu problema encaja con esa idea, un generator suele ser la solución más limpia.
¿Ya estás imaginando dónde aplicarlo en tu próximo proyecto con JavaScript? Cuéntame en los comentarios qué tipo de iteración te gustaría resolver con un generator.