How to return many Promises and wait for them all before doing other stuff

by

You can use Promise.all (spec, MDN) for that: It accepts a bunch of individual promises and gives you back a single promise that is resolved when all of the ones you gave it are resolved, or rejected when any of them is rejected.

So if you make doSomeAsyncStuff return a promise, then:

    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 has an article on promises here. I also cover promsies in detail in Chapter 8 of my book JavaScript: The New Toys, links in my profile if you’re interested.

Here’s an example:

 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();

Sample output (because of the Math.random, what finishes first may vary):

Resolving 3
Resolving 2
Resolving 1
Resolving 4
Resolving 0
All done [0,1,2,3,4]

More Related Contents:

  1. When is the body of a Promise executed?
  2. ES6 Promise.all() error handle – Is .settle() needed? [duplicate]
  3. Why can I not throw inside a Promise.catch handler?
  4. ES6 Promises – something like async.each?
  5. Why does the Promise constructor require a function that calls ‘resolve’ when complete, but ‘then’ does not – it returns a value instead?
  6. What is the best general practice to timeout a function in promise [closed]
  7. What are asynchronous functions in JavaScript? What is “async” and “await” in JavaScript?
  8. When would someone need to create a deferred?
  9. Promises, pass additional parameters to then chain
  10. How to extract data out of a Promise
  11. Are JavaScript forever-pending promises bad?
  12. Why does javascript ES6 Promises continue execution after a resolve?
  13. JavaScript asynchronous programming: promises vs generators
  14. ES6 Promise replacement of async.eachLimit / async.mapLimit
  15. Why does JavaScript Promise then handler run after other code?
  16. When is the body of a Promise constructor callback executed?
  17. Promise.all is returning an array of undefined and resolves before being done
  18. Can I fire and forget a promise in nodejs (ES7)?
  19. How can I fetch an array of URLs with Promise.all?
  20. What is the order of execution in JavaScript promises?
  21. How can I synchronously determine a JavaScript Promise’s state?
  22. How to wait for a JavaScript Promise to resolve before resuming function?
  23. How to async await in react render function?
  24. What does $.when.apply($, someArray) do?
  25. multiple, sequential fetch() Promise
  26. Should a Promise.reject message be wrapped in Error?
  27. Filtering an array with a function that returns a promise
  28. How to return from a Promise’s catch/then block?
  29. Why couldn’t popular JavaScript runtimes handle synchronous-looking asynchronous script?
  30. When does async function actually return a pending promise?

Leave a Comment