A medida que la construcción asíncrona / espera crece en popularidad, también lo hace el interés en sus mecanismos internos. Habiendo hurgado en Internet, es fácil descubrir que async / waitit se basa en promesas bien conocidas y generadores, que son mucho menos conocidos y populares.
El material, cuya traducción publicamos hoy, está dedicado a los generadores. A saber, aquí hablaremos sobre cómo funcionan y cómo, junto con las promesas, se usan en las entrañas de la construcción asíncrona / espera. El autor de este artículo dice que los generadores, en aras de su aplicación práctica, no son necesarios para dominar. Además, señala que espera que el lector sea un poco versado en las promesas.
Iteradores y Generadores
En JavaScript, comenzando con el lanzamiento del estándar ES6, han aparecido varias características nuevas que apuntan a simplificar el trabajo con flujos de datos asíncronos y colecciones.
Los iteradores y generadores entran en esta categoría.
Una característica notable de los iteradores es que proporcionan un medio para acceder a los elementos de la colección de uno en uno, mientras le permiten rastrear el identificador del elemento actual.
function makeIterator(array) { var nextIndex = 0; console.log("nextIndex =>", nextIndex); return { next: function() { return nextIndex < array.length ? { value: array[nextIndex++], done: false } : { done: true }; } }; } var it = makeIterator(["simple", "iterator"]); console.log(it.next()); // {value: 'simple, done: false} console.log(it.next()); // {value: 'iterator, done: false} console.log(it.next()); // {done: true}
Arriba, pasamos a la función
makeIterator() una pequeña matriz que contiene un par de elementos, después de lo cual lo revisamos con un iterador, llamando al método
it.next() . Presta atención a los comentarios que demuestran los resultados obtenidos con el iterador.
Ahora hablemos de generadores. Los generadores son funciones que funcionan como fábricas de iteradores. Considere un ejemplo simple y luego hable sobre dos mecanismos relacionados con los generadores.
function* sample() { yield "simple"; yield "generator"; } var it = sample(); console.log(it.next()); // {value: 'simple, done: false} console.log(it.next()); // {value: 'generator, done: false} console.log(it.next()); // {value: undefined, done: true}
Tenga en cuenta el asterisco en la declaración de función. Esto indica que esta función es un generador. Además, eche un vistazo a la palabra clave de
yield . Pausa la ejecución de la función y devuelve un cierto valor. En realidad, estas dos características son los dos mecanismos de los que hablamos anteriormente:
- Una función generadora es una función declarada usando un asterisco al lado de la palabra clave de la
function o al lado del nombre de la función. - El iterador generador se crea cuando se llama a la función generadora.
En general, el ejemplo anterior muestra el funcionamiento de una función de fábrica que genera iteradores.
Ahora que hemos descubierto los conceptos básicos, hablemos de cosas más interesantes. Los iteradores y los generadores pueden intercambiar datos en dos direcciones. A saber, los generadores, usando la palabra clave de
yield , pueden devolver valores a los iteradores, sin embargo, los iteradores también pueden enviar datos a los generadores usando el método
iterator.next('someValue') . Así es como se ve.
function* favBeer() { const reply = yield "What is your favorite type of beer?"; console.log(reply); if (reply !== "ipa") return "No soup for you!"; return "OK, soup."; } { const it = favBeer(); const q = it.next().value; // console.log(q); const a = it.next("lager").value; // console.log(a); } // What is your favorite beer? // lager // No soup for you! { const it = favBeer(); const q = it.next().value; // console.log(q); const a = it.next("ipa").value; // console.log(a); } // What is your favorite been? // ipa // OK, soup.
Generadores y promesas
Ahora podemos hablar sobre cómo los generadores y las promesas forman la base de la construcción asíncrona / espera. Imagine que en lugar de devolver algunos valores utilizando la palabra clave de
yield , el generador devuelve promesas. En esta situación, el generador puede envolverse en una función que esperará a que se resuelva la promesa y devolverá el valor de la promesa al generador en el método
.next() , como se muestra en el ejemplo anterior. Hay una biblioteca popular,
co , que realiza precisamente tales acciones. Se ve así:
co(function* doStuff(){ var result - yield someAsyncMethod(); var another = yield anotherAsyncFunction(); });
Resumen
Según el autor de este material, los desarrolladores de JS necesitan saber cómo funcionan los generadores, solo para comprender las características de la estructura interna del diseño asíncrono / espera. Pero usarlos directamente en su propio código no vale la pena. Los generadores introducen en JavaScript la capacidad de pausar la función y volver a ella cuando (y si) el desarrollador lo considera necesario. Hasta ahora, mientras trabajábamos con funciones JS, esperábamos que, cuando se les llama, simplemente se ejecuten de principio a fin. La capacidad de pausarlos ya es algo nuevo, pero esta funcionalidad se implementa convenientemente en la construcción asíncrona / espera.
Por supuesto, uno puede discutir con esta opinión. Por ejemplo, uno de los argumentos a favor de los generadores es que saber cómo funcionan es útil para depurar código con async / wait, ya que los generadores están ocultos dentro de esta construcción. Sin embargo, el autor del material cree que esto es, sin embargo, algo más que el uso de generadores en código nativo.
Estimados lectores! ¿Qué opinas de los generadores? ¿Quizás conoces algunas opciones para su uso que justifiquen su aplicación directa en el código de los proyectos JS?
Código promocional real para un 10% de descuento en nuestros servidores virtuales:
