¿TIENES DUDAS? te dejo un ejemplo con la API de jsonplaceholder, en este código usa html y css… código js <code>//ejemplo de generator bt...

Cristobal Nyram

Pregunta

student•hace 3 años

¿TIENES DUDAS?

te dejo un ejemplo con la API de jsonplaceholder, en este código usa html y css…

código js

//ejemplo de generator
btnGenerator =document.getElementById('generator-btn');
btnGenerator.addEventListener('click',()=>{
    get();
});

/**
 * Obtenedremos todo baja demanda
 */

async function* request(){
    let i =1;
    let url ='https://jsonplaceholder.typicode.com/todos/';//url de la api a donde hacemos la paticion
    while(true)
    {
        let resp = await  fetch(url+i);//usamos los generadores para tener una respuesra automatica
        let json = await resp.json();
        yield  json;
        i++;
    }
}
let r = request();//invamos la funcion  generadora

async function get(){
    let content = await r.next();///usamos async y await
    document.getElementById('myDiv').innerHTML+='Nombre: '+content.value.title+'<br>';
}

html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Generator</title>
</head>
<body>
        <button id="generator-btn">
            aqui
        </button>
        <div id="myDiv">

        </div>
        <script src="./genearator.js">
          
        </script>
</body>
</html>

Explicación: este código lo que hace es usar el concepto de generador, generador como tal nos ayuda a generar peticiones asíncronas de manera secuencial y mejorar la sintaxis.

Debemos tomar en cuenta lo siguiente:

Con los generator Obtendremos todo baja demanda,imaginate que cuando estás viendo Netflix y de repente pausas el video ,hay un generator que hace que pauses la solicitud de tu contenido…

Oh estás viendo el dashboard de platzi student ,este se muestra de acuerdo a como hagas ‘scroll’

¿TIENES DUDAS? te dejo un ejemplo con la API de jsonplaceholder, en este código usa html y css… código js <code>//ejemplo de generator bt...

Curso de Asincronismo con JavaScript

Curso de Asincronismo con JavaScript