如何使用 Promise.all 方法？ [关闭]答案

【问题标题】：how to use Promise.all method? [closed]如何使用 Promise.all 方法？ [关闭]
【发布时间】：2021-04-13 14:14:52
【问题描述】：

我在使用 Promise.all 时遇到问题当我尝试循环遍历数组以将元素转换为 json 时，它不起作用，有人能解释一下为什么它不起作用吗？

function getData() {

let getUsers = fetch('https://jsonplaceholder.typicode.com/users')
let getTodos = fetch('https://jsonplaceholder.typicode.com/todos')
Promise.all([getUsers, getTodos])
   .then(data => {
          data.forEach(item => {
            item.json()
            console.log(item)});
   })
   .catch(err => console.log(err))
}; 
getData();

【问题讨论】：

Promise.all 在fetch 调用数组上将为您提供一组获取响应对象，这些对象将具有json 方法 - 目前尚不清楚您在登录时期望发生什么@ 987654325@.
“不起作用”是什么意思？你遇到了什么错误？是网络错误还是JS错误？将错误作为文本放入您的问题中。
你也没有对item.json() 做任何事情（它也返回一个Promise）。
有什么原因不能使用async function？
item.json() 不会更改或修改 item 并且您不会“保留”返回的数据（这是 not json！）。

标签： javascript promise fetch fetch-api

【解决方案1】：

更好的主意：将您的 JavaScript 更改为使用 async function，这意味着您根本不需要使用 Promise.all，如下所示：

async function getData() {

    const usersPromise = fetch('https://jsonplaceholder.typicode.com/users');
    const todosPromise = fetch('https://jsonplaceholder.typicode.com/todos');

    const users = await usersPromise;
    const todos = await todosPromise;

    for( const todo of todos ) {
        console.log( todo );
    }
}

getData();

【讨论】：

【解决方案2】：

Promise.all() 接受一个 Promise 数组，returns 一个 Promise 解析为由 Promise 返回的值数组。

例如：

const promiseA = Promise.resolve('valueA');
const promiseB = Promise.resolve('valueB');

Promise.all([promiseA, promiseB]).then(data => {
   console.log(data); // [ 'valueA', 'valueB' ]
})

所以data 是一个数组[ users, todos ]（其中users 是fetch('https://jsonplaceholder.typicode.com/users') 的结果）

function getData() {

let getUsers = fetch('https://jsonplaceholder.typicode.com/users').then(response => response.json())
let getTodos = fetch('https://jsonplaceholder.typicode.com/todos').then(response => response.json())

Promise.all([getUsers, getTodos])
   .then(data => {
         const [users, todos] = data;
          users.forEach(user => {
            console.log(user)
          });
          todos.(todo => {
            console.log(todo)
          });
   })
   .catch(err => console.log(err))
}; 
getData();

【讨论】：