0Pricing
JavaScript Academy · Lección

Funciones generadoras, yield y pequeños pipelines

Escriba funciones generadoras con function*, use yield para producir valores de forma diferida, contrólelas con for...of o next() y componga pequeños pipelines.

Funciones generadoras, yield y pequeños pipelines es una lección gratuita de JavaScript Academy en CoddyKit. Esta es la lección 2 de 3. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de JavaScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de JavaScript Academy incluye 3 lecciones en total.

¿Por qué usar generadores?

Objetivo: Producir valores de forma diferida con generadores.

  • function* define un generador
  • yield produce valores paso a paso
  • Use for...of o next() para consumirlos
  • Componga pipelines pequeños similares a map
Funciones generadoras, yield y pequeños pipelines — ilustración 1

function* y yield

Los generadores usan function* y yield. La iteración se reanuda desde el último yield.

// A basic generator that yields 1..n lazily
function* countTo(n) {
  for (let i = 1; i <= n; i = i + 1) {
    yield i; // pause here and give i to the caller
  }
}

for (const x of countTo(3)) {
  console.log("value:", x);
}
Funciones generadoras, yield y pequeños pipelines — ilustración 2

next() manual

next() avanza de un yield al siguiente y finalmente devuelve done: true cuando termina.

// You can also drive a generator manually with next()
const it = countTo(2);

console.log(it.next()); // { value: 1, done: false }
console.log(it.next()); // { value: 2, done: false }
console.log(it.next()); // { value: undefined, done: true }
Funciones generadoras, yield y pequeños pipelines — ilustración 3

Números pares de forma diferida

Los generadores son ideales para crear flujos sencillos, como los números pares, sin tener que construir primero arrays grandes.

// Yield even numbers up to n (inclusive)
function* evensUpTo(n) {
  for (let i = 0; i <= n; i = i + 1) {
    if (i % 2 === 0) {
      yield i;
    }
  }
}

console.log("evens 0..6:", [...evensUpTo(6)]);
Funciones generadoras, yield y pequeños pipelines — ilustración 4

Canalización map diferida

Combine pasos pequeños: pase un generador a otro para crear canalizaciones diferidas.

// map() as a generator: transform values lazily
function* map(iterable, fn) {
  for (const v of iterable) {
    yield fn(v);
  }
}

const doubled = map(countTo(4), function (x) { return x * 2; });
console.log("doubled:", [...doubled]);
Funciones generadoras, yield y pequeños pipelines — ilustración 5

Buenos hábitos

Consejos:

  • Llame a la función generadora para obtener un iterador (no se ejecuta completamente de antemano).
  • yield hace una pausa; return finaliza la secuencia.
  • Cuando termina, un generador queda agotado; llame de nuevo a la función para obtener un iterador nuevo.
Funciones generadoras, yield y pequeños pipelines — ilustración 6

Cuestionario sobre el valor devuelto por el generador

Comprobación rápida: ¿qué devuelve una función generadora?

Funciones generadoras, yield y pequeños pipelines — ilustración 7

Resumen

Resumen: Defina function*, produzca valores con yield de forma diferida, consúmalos con for...of o next(), y combine pequeñas canalizaciones de generadores para realizar transformaciones sencillas.

Funciones generadoras, yield y pequeños pipelines — ilustración 8

Preguntas frecuentes

¿La lección «Funciones generadoras, yield y pequeños pipelines» es gratis?

Sí — el texto completo de «Funciones generadoras, yield y pequeños pipelines» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de JavaScript Academy, actualiza a CoddyKit PRO. El curso de JavaScript Academy incluye 3 lecciones en total.

¿Qué aprenderé en «Funciones generadoras, yield y pequeños pipelines»?

Escriba funciones generadoras con function*, use yield para producir valores de forma diferida, contrólelas con for...of o next() y componga pequeños pipelines. Practicas JavaScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar JavaScript Academy?

No se requiere experiencia previa. JavaScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 3.

¿Cuánto tiempo toma la lección «Funciones generadoras, yield y pequeños pipelines»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de JavaScript Academy?

Sí. Cada lección de JavaScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. Protocolo iterable y for...of
  2. Funciones generadoras, yield y pequeños pipelines
  3. Iteradores asíncronos: for await...of y generadores async
← Volver a JavaScript Academy