Write an Asynchronous Function with async/await

Call an Asynchronous Function in a Promise Chain

Convert Any Function into an Asynchronous Function

Handle Errors in Asynchronous Functions

Await Multiple Promises Sequentially or Concurrently

Await Multiple Promises Concurrently with Promise.all()

Use the await Operator with Any Thenable

Iterate Asynchronously with the for-await-of Loop

Asynchronous JavaScript with async/await

Oftentimes, you want to kick off multiple promises in parallel rather than awaiting them in sequence. This lesson explains how that can be achieved in a readable manner using `await`, the `Promise.all()` method, and destructuring assignment.

https://app.egghead.io/api/v1/lessons/javascript-await-multiple-promises-concurrently-with-promise-all/subtitles

[00:00] In this lesson, I want to show you how to await multiple asynchronous operations using the Promise.all method. Promise.all accepts a sequence of promises and returns a single new promise. If all of the passed-in promises are resolved, a return promise is resolved as well. Otherwise, it is rejected.

[00:20] The idea is that the Promise.all method can be used to aggregate the results of multiple promises. In our example, we want to make two requests to the GitHub API. We want to fetch a user, and then also a list of their repositories.

[00:35] We are going to call the Promise.all method with an array of two promises. We are then going to await the promise that is returned by Promise.all, and we're going to store the results in a variable called results.

[00:49] This variable contains an array with the values of the passed-in promises. In our case, this is an array with two elements. The order of the values corresponds to the order of the promises in this array. This means that we can find the user at index 0and the repositories at index 1.

[01:09] To demonstrate that this approach works, let's log the username and the repository count to the console, as we did in previous examples. If we quickly run the program, we get the data we expect.

[01:24] Now that we've seen that our program works, I want to do a small refactoring. We can get rid of these two lines and directly destructure this array into a user and the repositories using the ES2015 destructuring syntax.

[01:38] In my opinion, the code was pretty nice to read. We have the user promise here, and the user value here, and we have the repos promise here, and the repos up here. Remember that the order of the promises that you pass into Promise.all determines the order of the resulting values in the array.

[01:59] There are two more things I want to mention. In our example, we've used the Promise.all method with an array, but it actually works with any iterable. Also, the Promise.all method has fail-fast behavior.

[02:13] If any of the passed-in promises is rejected, the return promise is immediately rejected as well. In that case, Promise.all does not wait for all passed-in promises to be settled. Let's run our program one more time to make sure we haven't broken anything. It looks like everything is still working just fine.

Await Multiple Promises Concurrently with Promise.all()

Share this video with your friends

Course

Asynchronous JavaScript with async/await