Async and Await Concepts in JavaScript

It is synchronous to use JavaScript!

This indicates that just one operation can be performed simultaneously (i.e single-threaded). Additionally, JavaScript gives us certain tools to make it behave like an asynchronous language. The Async-Await clause is one of them.

Describe async-await.

Promising is an extension of async and await. Before moving on to async/await, you should first understand the ideas of promises (future).

Async

Promise-based programming can be written using async functions to simulate synchronous behavior without halting the execution thread. The event loop is used for its asynchronous operation and Async functions always return a value. Simply said, using async means that a promise will be fulfilled and returned.

async function testAsync() {

  return 23;

}

testAsync().then(alert);

Output: 23;

Running the aforementioned code results in an alert output of 23, which indicates that a "promise" was given; otherwise, it would be impossible to use the.then() method.

Await

To asynchronously wait for a Promise to finish, use the await operator. It's only applicable inside of an async block. The keyword "await" instructs JavaScript to wait until the promise has not been fulfilled. It must be noticed that only the async function block is delayed, not the complete execution of the program.

The code snippet below demonstrates how Async and Await are used in tandem.

async function testAsync() {

let promise = new Promise((res, rej) =>  {

     setTimeout(() => res("Now it's done!"), 1000)

});

// Wait till the promise returns a value.

let result = await promise;

    // "Now it's done!"

alert(result);

}

};

testAsync();

Observations when utilizing Async Await

The await keyword is not allowed inside normal functions.

Syntactical Error 

function testAsync() {

  let promise = Promise.resolve(10);

  let result = await promise; // Here Syntax error

}

We must add "async" before the function "testAsync()" for it to function correctly.

With Async Await, execution is sequential.

Parallel execution is substantially faster, yet this is not necessarily a bad thing.

async function sequence() {

  await promise1(100); // Wait 100ms…

  await promise2(100); // …then wait another 100ms.

  return "complete async function!";

}