javascript - forEach如何实现同步？

Question

　const arr = [1,2,3,4,5,6];        const result = [];        const fn = (item) => {            let time = Math.ceil(Math.random()*1000)            return new Promise(resolve => {                setTimeout(() => {                    resolve(item)                }, time);            })        }        arr.forEach(async (item) => {            const val = await fn(item);            result.push(val);            console.log(result);        })

forEach如何实现同步

Answer 1

forEach无法同步执行多个Promise代码，你得用map返回一个Promise数组，然后用Promise.all执行

let requestList = arr.map(async (item) => await fn(item))await Promise.all(requestList)

Answer 2

在JavaScript中，Array.prototype.forEach方法默认是同步执行的，不会等待回调函数完成就立即执行下一个迭代。然而，你的代码示例中使用了async/await，这会使forEach内部的回调函数变为异步执行。

要实现forEach的同步行为，你需要避免在回调中使用async/await，或者改用其他方法，如Array.prototype.map配合Promise.all。

以下是一个使用map和Promise.all实现同步行为的示例：

const arr = [1,2,3,4,5,6];const fn = (item) => {    let time = Math.ceil(Math.random()*1000);    return new Promise(resolve => {        setTimeout(() => {            resolve(item);        }, time);    });};// 使用map将数组转换为Promise数组const promises = arr.map(item => fn(item));// 使用Promise.all等待所有Promise完成Promise.all(promises).then(results => {    console.log(results);});

在这个示例中，Promise.all会等待所有Promise都完成，然后一次性返回所有的结果。这样就可以实现类似同步的效果，而不会受到异步操作的影响。

需要注意的是，虽然这个示例在结果上看起来像是同步的，但实际上它仍然是异步执行的。这是因为JavaScript本身是单线程的，它使用事件循环来处理异步操作。即使我们使用Promise.all来等待所有Promise完成，这并不意味着代码是同步执行的。它只是让我们能够以更直观的方式处理异步操作的结果。