javascript - 识别带有一个异步函数调用的嵌套 FOR 循环和 IF 语句何时完成

Question

我有一个带有嵌套 for 循环和 IF 语句以及一次异步函数调用的函数。结构看起来类似于:

search(){
    // for loop 1
    for (let i in object){

      // IF statement 1
      if (condition1){

        // for loop 2
        for (let o in object[i]){

          // IF statement 2
          if (condition2){

            // call of an asynchronous function
            this.asyncFunction().then( data => {

              this.result.push(data)

            });
          }
        }
      }
    }
  }

我想在所有循环完成并且所有异步函数调用完成后立即调用一个函数(比方说 goToNextPage() )，因此，我的 this.result 对象已完成。

但是，我不知道如何管理它。我尝试使用计数器，以了解何时处理最后一个 object[i] 以及何时处理最后一个 object[i][o] 来调用 之后转到NextPage()。但如果最后一个对象未​​能通过 if 语句，则此方法无法正常工作。然后调用 goToNextPage()，同时倒数第二个对象的异步函数仍在运行。

我不能只在

内调用 goToNextPage()

this.asyncFunction().then( data => {
    this.result.push(data)
    // call it here, if last element is reached
});

从那时起，如果最后一个元素不满足 IF 语句之一，则不会调用它。

我希望大家可以理解我的问题是什么，并且有一个解决方案......

感谢您的宝贵时间!

Answer 1

Koleman 在官方 Ionic 论坛上完美回答了这个问题，从而帮助我找到了解决方案:Link

他的方法是在结构中插入 Promise 并使用 Promise.all(promises).then(...) 等待所有 Promise 都得到解决。

search(){
   let promises = [];
    // for loop 1
    for (let i in object){
        // IF statement 1
        if (condition1){
            // for loop 2
            for (let o in object[i]){
                // IF statement 2
                if (condition2){
                    let promise = new Promise((resolve, reject) => { 
                        this.asyncFunction().then( data => resolve(data)); 
                    });
                    promises.push(promise); 
                }
            }
        }
    }

    return new Promise((resolve, reject) => {
        if(!promises.length){
            reject('Something went worng!');
        }else{
            Promise.all(promises).then((results) => {
                this.result = this.result.concat(results);
                resolve('We done it!');
            });
        }        
    });         
  }

  search().then(
    successText => {
        console.log(statusText);
        console.log(this.result);
    },
    failText => {
        console.log(failText);
    }
  );