Async-await
- Async-await are the two keywords that we use to illustrate a particular function or method as an asynchronous data acceptor.
- Using async-await keywords we may easily show and capture the asynchronous, promise-based behavior in a very much cleaner style.
Syntax:
let method = async () => {
let result = await (value);
.....
}
Now that we have understood in brief about Promise.all() and async-await let us now jump into our task of implementing Promise.all() with async-await.
Example 1: In this example, we will create two promises inside two different functions (or methods) and in another function we will access them using Promise.all() along with making that function async and promise resulting fetching will be done along with the await keyword.
Javascript
// Defining our first promise let firstPromise = () => { return new Promise((resolve, reject) => { resolve( "Hello! " ); }); }; // Defining our second promise let secondPromise = () => { return new Promise((resolve, reject) => { resolve( "Hi! " ); }); }; // Async function to perform execution of all promise let promiseExecution = async () => { let promise = await Promise.all([ firstPromise(), secondPromise(), ]); console.log(promise); }; // Function call promiseExecution(); |
Output:
['Hello! ', 'Hi! ']
Example 2: In this example too we will create two simple promises and one promise in which we will be using a timer function (setTimeout) inside three different methods and one separate method for promises execution.
Javascript
// Defined our first promise let firstPromise = () => { return new Promise((resolve, reject) => { resolve( "Hello! " ); }); }; // Defined our second promise let secondPromise = () => { return new Promise((resolve, reject) => { resolve( "Hi! " ); }); }; // Defined our third promise let thirdPromise = () => { return new Promise((resolve, reject) => { return setTimeout(() => { resolve( "w3wiki" ); }, 2000); }); }; // Async function to perform execution of all promise let promiseExecution = async () => { let promise = await Promise.all([ firstPromise(), secondPromise(), thirdPromise(), ]); console.log(promise); }; // Function call promiseExecution(); |
Output:
[ 'Hello! ', 'Hi! ', 'w3wiki' ]
Reference: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await#awaiting_a_promise.all
Explain Promise.all with async-await in JavaScript
In this article, we will try to understand how we could use Promise.all() along with the async-await using certain predefined syntax with ease in JavaScript. Before we directly jump into our defined task, let us first understand quickly in brief the basics associated with the Promise.all() and async-await.