javascript - 在 .forEach 完成后执行回调函数

Question

我正在尝试在 forEach 循环完成所有迭代后执行一个函数。

这answer提供了一个有趣的解决方案，但我无法让它工作。

这是我改编的代码，创建了一个简单的 asyncFunction()。

function callback () { console.log('all done'); }
function asyncFunction(item) {
  console.log("in async function, item is " + item)
}
var itemsProcessed = 0;

[1, 2, 3].forEach((item, index, array) => {
  asyncFunction(item, () => {
    itemsProcessed++;
    console.log("in callback area, itemsProcessed is " + itemsProcessed )
    if(itemsProcessed === array.length) {
      callback();
    }
  });
});

在这个 JSfiddle 中可见，脚本正确执行异步函数，但未能进入增加 itemsProcessed 并应触发 callback() 函数的部分。

我对粗箭头函数不太熟悉，所以错误可能来自于它们的使用。

谁能解释为什么脚本没有按预期运行？

Answer 1

在这种情况下，更现代的方法是使用 promises

function asyncFunction(item) {
   // return a promise
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("in async function, item is " + item)
      // resolve promise when data is ready
      resolve(item)
    }, Math.random()*2000)// random delay to stagger order of returns

  })

}

// create array of promises
let promiseArray = [1, 2, 3].map(asyncFunction);

// runs when all promises are resolved
Promise.all(promiseArray).then(results => {
  console.log('all done')
  // results array will be in same order as original array
  console.log('results are: ', results)
})

.as-console-wrapper {max-height: 100%!important;top:0}