1

Me gustaría utilizar Promise.all en el siguiente código para que se ejecute cuando se haya obtenido una respuesta de las promesas getUsers y getTodos.

¿Pueden darme un ejemplo de cómo implementarlo?

async function getData() {
  try {
    let getUsers = await fetch('https://jsonplaceholder.typicode.com/users');
    let getTodos = await fetch('https://jsonplaceholder.typicode.com/todos');
    let users = await getUsers.json();
    let todos = await getTodos.json();
    let user = users.map(item => item.name);
    let todo = todos.map(item => item.title);
    console.log(user);
    console.log(todo);
  } catch (error) {
    console.log('error: ' + error);
  }
};
getData();

1 respuesta 1

6

Lo que hace Promise.all() es esperar a todas las promesas dentro de un array, es importante recalcar que en el momento en que una de todas las promesas del array falle, todo el Promise.all() lo hará y no vas a tener acceso a tus datos.

Yo haría esto:

  1. Encapsulo la función que obtiene los datos y les hace el parse (.json()).
  2. Utilizo un array con las funciones encapsuladas para utilizar con Promise.all()
  3. Utilizo el await haciendo una destructuración sobre el array para obtener los resultados.

const fetcher = async(path) => {
  let response = await fetch('https://jsonplaceholder.typicode.com' + path);
  return await response.json()
}

async function getData() {
  try {
    let [users, todos] = await Promise.all([fetcher('/users'), fetcher('/todos')]);

    let user = users.map(item => item.name);
    let todo = todos.map(item => item.title);
    console.log(user);
    console.log(todo);
  } catch (error) {
    console.log('error: ' + error);
  }
};
getData();

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.