How to throw an error in an async generator function in JavaScript ?


The code often throws an error, and handling errors is more important. JavaScript also allows users to throw a custom error using the ‘throw’ keyword. We can catch the errors in the catch block.

We can use the try-catch syntax to catch errors thrown by normal functions. Let’s understand it by the example below.

Example 1 (Throw Errors in Regular Function)

In the example below, we have created the throwError() regular function, which uses the throw keyword to throw an error with the custom error message. We have executed the function inside the try block. If the function throws any error, controls go to the catch block, and that’s how we can detect the error.

<html>
<body>
   <h3> Using the throw keyword to throw an error from the normal function </h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      // throw error from normal function
      function throwError() {
         throw new Error('Error from normal function');
      }
      try {
         throwError();
      } catch (e) {
         content.innerHTML = e;
      }
   </script>
</body>
</html>

If we make the throwError() function asynchronous, it will generate another error, as we can handle the errors thrown by the synchronous function using the try-catch block.

To solve the problem, users must use the then-catch block syntax to resolve the promises.

Syntax

Users can follow the syntax below to resolve the errors the async function throws.

throwError().then((res) => {
   // print content
}).catch((err) => {
   // print error message
})

In the above syntax, throwError() is a function that returns the promises, which we solve using the then and catch block.

Example 2 (Throw Error From Async Function)

In the example below, the throwError() function is an asynchronous function, as we have added the ‘async’ keyword before the function keyword. We have thrown the error from the async function as we throw from the regular function.

After that, we handled the promise using the then and catch block. In the output, users can observe that as the async function throws an error, control goes to the catch block.

<html>
<body>
   <h3> Using the <i> throw </i> keyword to throw an error from the async function </h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      // throw error from normal function
      async function throwError() {
         throw new Error('Error from Async function');
      }
      throwError().then((res) => {
         content.innerHTML = res;
      }).catch((err) => {
         content.innerHTML = err;
      })
   </script>
</body>
</html>

Example 3 (Throw Error by Rejecting Promise in Async Function)

We can return the promises from the async function. The rejecting promise in the async function works like throwing the error. We have used the reject() method inside the callback function to reject the promise.

The ‘then-catch’ block is used to resolve the promise returned by function, and users can see that controls go to the catch block.

<html>
<body>
   <h3> Using the <i> reject </i> method to throw an error from the async function </h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      // throw error from normal function
      async function throwError() {
         return new Promise((resolve, reject) => {
            reject("This promise is rejected from the async function." );
         });
      }
      throwError().then((res) => {
         content.innerHTML = res;
      }).catch((err) => {
         content.innerHTML = err;
      })
   </script>
</body>
</html>

Users learned to throw an error from the asynchronous function. Users can use the ‘throw’ keyword like the regular function to throw an error. Users need to handle the error using the ‘then-catch’ block as the async function returns the promise rather than handling using the try-catch block.

Updated on: 05-Apr-2023

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements