Generators: Funciones asíncronas en combinación con yield

Generators: Funciones asíncronas en combinación con yield

¿Cómo combinar el uso de funciones asíncronas y generators?

Las funciones asíncronas trabajan bien con funciones que retornan Promises. Esto es porque las funciones Generator pueden yield una Promise, procesar el resultado de un Promise de forma asíncrona, y recibir un Promise de resultado de egreso. Esto permite al código asíncrono el ser escrito dentro de funciones asíncronas como funciones asíncronas normales.

Ejemplo de como las Promises pueden ser escritas en una forma asíncrona dentro de funciones Generator.

<!doctype html>
<html>
<head>
    <title>Generators con funciones asíncronas</title>
    <script>
        function* funGenerator(){
            var title = yield fetch("https://jsonplaceholder.typicode.com/posts/1");
            var title2 = yield fetch("https://jsonplaceholder.typicode.com/posts/2");
        }

        var og = funGenerator(); // crear generator object

        var promise1 = og.next().value; // procesar async como sync

        promise1.then(val => { // retraer primer promise y procesarlo
            return val.json();
        }).then(json => {
            console.log(json.title); // extraer title del json
            var promise2 = og.next().value; // extraer promise 2
            return promise2; // retornar promise
        }).then(val => {
            return val.json(); // retornar json
        }).then(json => {
            console.log(json.title); // imprimir title del json
        }).catch(err => {
            console.log(err);
        });
    </script>
</head>
<body>
    <h1>Generators con funciones asíncronas</h1>
</body>
</html>