如何在调用Promise函数的forEach循环中等待每次迭代完成

嘿，这个场景太常见了！你现在用forEach的问题在于，它会一口气把所有promiseFunction都调用了，根本不会等待上一个Promise完成——所有请求会并行发起。要实现串行执行（等当前请求拿到响应后再跑下一个），结合你在用的Bluebird Promise库，有几种非常实用的方法：

方法1：用Bluebird自带的Promise.each（最省心） #

既然已经用了Bluebird，直接用它提供的Promise.each就好，这个方法就是专门用来串行遍历数组并执行Promise的：

var urls = ["url1","url2","url3"];

// Promise.each会自动等待每个Promise resolve后，再处理下一个元素
Promise.each(urls, function(url, index) {
  console.log(`开始处理第${index+1}个URL: ${url}`);
  return promiseFunction(url);
})
.then(function() {
  console.log("所有请求都按顺序完成啦！");
})
.catch(function(error) {
  console.error("某个请求出错，后续执行终止:", error);
});

function promiseFunction(string) {
  return new Promise(function(resolve, reject) {
    // 这里写你的Fetch请求和计算逻辑
    // 用setTimeout模拟异步操作
    setTimeout(() => {
      console.log(`完成处理: ${string}`);
      resolve();
    }, 1000);
  });
}

为什么选这个？ 它不仅帮你搞定了串行逻辑，还自带错误处理——如果中间任何一个Promise被reject，整个流程会立刻停止，不会继续执行后续请求，非常符合大多数场景的需求。

方法2：用async/await配合for循环（ES6+可读性拉满） #

如果你更喜欢ES6+的写法，用async函数配合普通for循环（或for...of）也能轻松实现：

var urls = ["url1","url2","url3"];

async function processUrlsSequentially() {
  for (const [index, url] of urls.entries()) {
    console.log(`开始处理第${index+1}个URL: ${url}`);
    // await会暂停函数执行，直到当前Promise完成
    await promiseFunction(url);
  }
  console.log("所有串行请求全部完成！");
}

// 执行函数并处理错误
processUrlsSequentially().catch(error => {
  console.error("请求出错:", error);
});

function promiseFunction(string) {
  return new Promise(function(resolve, reject) {
    // Fetch请求与计算逻辑
    setTimeout(() => {
      console.log(`完成处理: ${string}`);
      resolve();
    }, 1000);
  });
}

注意！ 别用forEach配合await——forEach并不会等待异步操作完成，它会直接跳过await继续执行下一个循环，达不到串行的效果。普通for循环/for...of才是正确选择。

方法3：传统Promise链式调用（兼容旧环境） #

如果你的环境不支持async/await，也可以用传统的Promise链式调用来实现：

var urls = ["url1","url2","url3"];

// 从一个已resolve的Promise开始构建调用链
let promiseChain = Promise.resolve();

urls.forEach(url => {
  // 不断把新的then回调添加到链上
  promiseChain = promiseChain.then(() => {
    console.log(`开始处理: ${url}`);
    return promiseFunction(url);
  });
});

promiseChain
.then(() => console.log("所有串行请求完成"))
.catch(error => console.error("出错:", error));

function promiseFunction(string) {
  return new Promise(function(resolve, reject) {
    setTimeout(() => {
      console.log(`完成处理: ${string}`);
      resolve();
    }, 1000);
  });
}

这种写法的核心是通过不断更新promiseChain变量，把每个Promise的执行逻辑串起来，缺点是可读性不如前两种，但胜在兼容性好。

内容的提问来源于stack exchange，提问作者Piero