JavaScript中如何在数组内Promise已解决时立即处理其返回结果

原逻辑使用Promise.all会等待所有请求全部进入resolved状态才统一触发处理，要实现任意请求完成就立刻处理返回结果、不需要等待其余请求的效果，直接在每个请求生成时就绑定独立的处理回调即可。

核心实现代码 #

for (let i = 0; i < fdlist.length; i++) {
  // 循环发起请求，每个请求单独绑定处理逻辑
  fetch(`${domain}/segment?mode=${mode}&type=${type}`, {
    method: 'POST',
    body: fdlist[i]
  })
  .then((res) => res.json())
  .then((resData) => {
    // 此处写单条请求返回后的业务处理逻辑
    // 哪个请求先返回，就会先触发对应逻辑，无需等待其他请求
    console.log(`第${i}个请求处理完成，返回结果：`, resData)
  })
  .catch((err) => {
    // 单个请求报错单独捕获处理，不会阻塞其他请求正常执行
    console.error(`第${i}个请求请求失败：`, err)
  })
}

补充说明 #

• 该实现不会改变批量并发发请求的逻辑，所有请求会按原有节奏发出，不存在排队阻塞的问题，只是处理逻辑从“等所有齐了再处理”变成“回来一个处理一个”。
• 注意不要误用Promise.race实现该需求：Promise.race只会响应第一个状态变更的Promise结果，其余请求后续完成时不会触发处理，完全不符合需求。
• 如果需要感知所有请求全部完成的时机，可以搭配计数器实现，参考代码如下：

const requestTotal = fdlist.length
let finishedCount = 0

for (let i = 0; i < requestTotal; i++) {
  fetch(`${domain}/segment?mode=${mode}&type=${type}`, {
    method: 'POST',
    body: fdlist[i]
  })
  .then((res) => res.json())
  .then((resData) => {
    // 单条即时处理逻辑
    console.log(`第${i}个请求处理完成，返回结果：`, resData)
  })
  .catch((err) => {
    console.error(`第${i}个请求请求失败：`, err)
  })
  .finally(() => {
    finishedCount++
    // 计数等于总数时，代表所有请求（无论成功失败）都已处理完成
    if (finishedCount === requestTotal) {
      console.log('全部请求处理完毕')
      // 所有请求处理完成后的收尾逻辑写在这里
    }
  })
}

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