es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Async / Await busca resultados en una variable.

Soy un traductor de español que traduce documentos de TI. Traduzca lo siguiente al español. No traduzca el código y la salida en markdown

Soy la primera vez que uso Async/Await en JS, así que estoy un poco confundido. Necesito obtener un objeto JSON de una API de prueba y almacenarlo de alguna manera en una variable global para poder usarlo fuera de la función asíncrona, intenté muchas soluciones que encontré en Google, pero todo lo que intenté me devuelve undefined, array vacío o en la mayoría de los casos – Promise { }

Mi código actualmente se ve así:

“ `
let myArray = [];

async function fetchExam(id) {
try {
const response = await fetch(‘https://jsonplaceholder.typicode.com/posts’, {
method: ‘GET’,
credentials: ‘same-origin’
});
const exam = await response.json();
return exam;
} catch (error) {
console.error(error);
}
}

async function renderExam(id) {
const exam = await fetchExam(id);
console.log(exam);
}

renderExam()
console.log(renderExam())
“`

Solo quiero asignar el objeto JSON que se encuentra en la variable exam a un array llamado myArray. La última línea devuelve Promise { } y console.log en la función renderExam devuelve un JSON válido. Entonces, necesito ese JSON fuera de las funciones asíncronas.

Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Para almacenar el objeto JSON fuera de la función asíncrona, se puede utilizar el método then() para encadenar otra función que asignará el resultado a la variable global myArray. De esta manera se modifica el código:

    let myArray = [];
    
    async function fetchExam(id) {
      try {
          const response = await fetch('https://jsonplaceholder.typicode.com/posts', {
              method: 'GET',
              credentials: 'same-origin'
          });
          const exam = await response.json();
          return exam;
      } catch (error) {
          console.error(error);
      }
    }
    
    async function renderExam(id) {
      const exam = await fetchExam(id);
      console.log(exam);
      return exam;
    }
    
    renderExam().then(exam => {
      myArray = exam;
      console.log(myArray); // esto registrará el objeto JSON en la variable global
    });
    
    console.log(myArray); // esto registrará un arreglo vacío porque la operación asíncrona aún está pendiente.
    

    Lo que ocurre en este código modificado es que la función renderExam() retorna una promesa que resuelve con el objeto JSON. Luego, podemos usar el método then() en esta promesa para esperar el resultado y asignarlo a la variable global myArray. Por último, podemos registrar el valor de myArray para verificar que se ha actualizado con el objeto JSON.

    Cabe destacar que la última línea console.log(renderExam()) es redundante porque renderExam() ya registra el objeto JSON en la consola.

Comments are closed.