首页 > 解决方案 > 如何在 JavaScript 中将 promise 与多个子异步请求链接起来?

问题描述

我有几个异步函数,我希望它们都同步运行。所以尝试使用 Promise 来完成它,但它并没有等待第三个函数完成。它在 asyncDataRequestOne 请求后返回循环。

我进行了搜索,但找不到如下或类似链接承诺的示例。

这是我尝试过的

试验 1


function three(j){
 return new Promise((resolve,reject)=>{
   asyncDataRequestThree(()=>{
     let k = j + 14; 
     resolve();
   });
 });
}

function two(i){
 return new Promise((resolve, reject)=>{
  asyncDataRequestOne().then(()=>{
   asyncDataRequestTwo().then(()=>{
     let  = i+ 7;
     three(j);
     resolve()
   });
  });
 });
}

function one(){
  //Each loop should run only after function three's resolve
  arr.forEach((i) => {
    two(i);
  }
}

试验 2

function async three(j){
   await asyncDataRequestThree(()=>{
     let k = j + 14; 
   });
 });
}

function async two(i){
  await asyncDataRequestOne().then(  async ()=>{
   await asyncDataRequestTwo().then(  async ()=>{
     let  = i+ 7;
     await three(j);
   });
  });
}

function one(){
  //Each loop should run only after function three's resolve
  arr.forEach( async () =>{
    await two(i);
  }
}

谢谢

标签: javascriptasynchronouspromise

解决方案


Array 的forEach循环在内部实现了这样的东西:

for (var element in array) {
  callback(element); // assuming callback is the argument of Array.forEach()
}

所以如果你添加async到函数声明中,它只会让它返回Promise。循环不会等待Promise完成callback,它只会等待callback自己完成。否则Array.forEach()也必须返回Promise

// assuming asyncDataRequestOne, asyncDataRequestTwo, asyncDataRequestThree will return Promise
async three(j) {
  await asyncDataRequestThree();
  // some kind of operation with j
}

async two(i) {
  await asyncDataRequestOne();
  await asyncDataRequestTwo();
  let j = i + 7;
  await three(j)
}

async function one() {
   for (let i = 0; i < 10; i++) {
      await two(i);
   }
}

推荐阅读