javascript - 如何返回许多 promise 并在做其他事情之前等待它们

Question

我有一个循环，它调用一个异步执行操作的方法。这个循环可以多次调用该方法。在这个循环之后，我有另一个循环，只有在所有异步工作都完成后才需要执行它。
所以这说明了我想要的:

for (i = 0; i < 5; i++) {
    doSomeAsyncStuff();    
}

for (i = 0; i < 5; i++) {
    doSomeStuffOnlyWhenTheAsyncStuffIsFinish();    
}

我对 promise 不是很熟悉，所以有人可以帮助我实现这一目标吗？
这是我的 doSomeAsyncStuff() 的行为方式:

function doSomeAsyncStuff() {
    var editor = generateCKEditor();
    editor.on('instanceReady', function(evt) {
        doSomeStuff();
        // There should be the resolve() of the promises I think.
    })
}

也许我必须做这样的事情:

function doSomeAsyncStuff() {
    var editor = generateCKEditor();
    return new Promise(function(resolve,refuse) {
        editor.on('instanceReady', function(evt) {
            doSomeStuff();
            resolve(true);
        });
    });
}

但我不确定语法。

Answer 1

你可以使用 Promise.all ( spec , MDN ):它接受一堆单独的 promise ，并给你一个单一的 promise ，当你给它的所有 promise 都得到解决时，这个 promise 得到解决，或者当其中任何一个被拒绝时被拒绝。
所以如果你让 doSomeAsyncStuff 返回一个 promise，那么:

    const promises = [];
//  ^^^^^−−−−−−−−−−−−−−−−−−−−−−−−−−− use `const` or `let`, not `var`
    
    for (let i = 0; i < 5; i++) {
//       ^^^−−−−−−−−−−−−−−−−−−−−−−−− added missing declaration
        promises.push(doSomeAsyncStuff());
    }
    
    Promise.all(promises)
        .then(() => {
            for (let i = 0; i < 5; i++) {
//               ^^^−−−−−−−−−−−−−−−− added missing declaration
                doSomeStuffOnlyWhenTheAsyncStuffIsFinish();    
            }
        })
        .catch((e) => {
            // handle errors here
        });

MDN 有一篇关于 promise here 的文章。我还在我的书 JavaScript: The New Toys 的第 8 章中详细介绍了 promsies，如果您感兴趣，可以在我的个人资料中找到链接。
下面是一个例子:

 function doSomethingAsync(value) {
     return new Promise((resolve) => {
         setTimeout(() => {
             console.log("Resolving " + value);
             resolve(value);
         }, Math.floor(Math.random() * 1000));
     });
   }
   
   function test() {
       const promises = [];
       
       for (let i = 0; i < 5; ++i) {
           promises.push(doSomethingAsync(i));
       }
       
       Promise.all(promises)
           .then((results) => {
               console.log("All done", results);
           })
           .catch((e) => {
               // Handle errors here
           });
   }
   
   test();

示例输出(由于 Math.random ，首先完成的内容可能会有所不同):
解决 3
解决 2
解决 1
解决 4
解析 0
全部完成 [0,1,2,3,4]