Async await basic tutorials and examples

This tutorial explains async and await with examples.

Async functions are used for asynchronous programming. They always return a promise. If the function doesn’t return a promise explicitly, it wraps the result in one.

#How to Declare Async Functions in Multiple Ways

Async functions are used to perform asynchronous tasks. They pause the current execution and place it in a separate queue called the event queue. In real-time applications, async functions are commonly used for API processing.

• async normal functions Async function are declared with the keyword async. It is a normal function

  async function getMessage() {
  return "Welcome";
  }

  which is equal to

  async function getMessage() {
    return Promise.resolve("Welcome");
  }

• async function anonymous expressions Async functions can also be declared anonymously without a name. These can be assigned to a variable.

  const variable = async function () {
    // do something
  };

  Calling an async function always returns a Promise. You can explicitly return either a promise or a value wrapped within a promise.

  console.log(getMessage())

• Async Arrow functions examples

Arrow functions can be declared and assigned to JavaScript variables. They can be declared with or without arguments.

Async Arrow function without arguments

const getMessage = async () => {
  console.log("Hello ")
}

Async with single arguments. Parentheses for a single argument are optional.

const getMessage = async (msg) => {
  console.log("Hello ",msg)
}
or
const getMessage = async msg => {
  console.log("Hello ",msg)
}

Multiple arguments to arrow async functions

const getMessage = async (msg1,msg2) => {
  console.log("Hello ",msg)
}

• Async function also declared with static

static myfunc = async () => {
  console.log("static function ")
}

#How to Call Async Functions

Async functions are asynchronous and always return a Promise.

Calling an async function always returns a Promise.

• Using the Await Keyword

Async functions are called using the await keyword.

await waits for a function to finish its execution. It can only be called within an async function.

async function getMessage() {
  return "Welcome";
}
console.log(getMessage())
async function callMessage() {
const result = await getMessage();
    console.log(result); // will print "welcome"
}

callMessage()

If await is called without an async function, it throws an error:

SyntaxError: await is only valid in async functions and the top-level bodies of modules

async function getMessage() {
  return "Welcome";
}
console.log(getMessage())
 function callMessage() {
  const result = await getMessage();
  console.log(result); // will print "Hello world!"
}

callMessage()

• How to Call Async Functions in Synchronized Functions

You have to use the then and catch blocks in synchronized functions.

then() is used for successfully resolved promises.

async function getMessage() {
  return "Welcome";
}
async function callMessage() {
getMessage()
.then(data=>console.log("success",data))
.catch(error=>console.log("error: ",error))
}

callMessage()// Prints success Welcome

• async functions throws an error

If an async function throws an error, the catch block is called to handle the error.

async function getMessage() {
  throw "failed";
}
async function callMessage() {
getMessage()
.then(data=>console.log(data))
.catch(error=>console.log("error",error))
}

callMessage() // error failed

• Async Functions Rejecting Promises

If an async function rejects a promise, the catch function is called with an error.

async function getMessage() {
  Promise.reject("fail");
}
async function callMessage() {
  getMessage()
    .then((data) => console.log("success", data))
    .catch((error) => console.log("error", error));
}

callMessage();

Above code throws

[UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block or by rejecting a promise which was not handled with .catch(). The promise was rejected with the reason "fail".] {
  code: 'ERR_UNHANDLED_REJECTION'

success undefined

node:internal/process/promises:279
triggerUncaughtException(err, true /_ fromPromise _);
^

[UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block or by rejecting a promise which was not handled with .catch(). The promise was rejected with the reason "fail".] {
code: 'ERR_UNHANDLED_REJECTION'
}

It calls a catch block with an undefined result.

• async functions returns rejected promise

catch function call back is called with an error

async function getMessage() {
return Promise.reject("fail")
}
async function callMessage() {
getMessage()
.then(data=>console.log("success",data))
.catch(error=>console.log("error",error))
}

callMessage();

Output:

error fail