How to implement asynchronous processing using JavaScript Promise

This article explains how to implement asynchronous processing using JavaScript Promise objects.

How can I do asynchronous processing?

An easy way to do asynchronous processing is to use Promise objects. 
Let’s introduce how to implement asynchronous processing using Promise objects.

“Promise object” for asynchronous processing

For asynchronous processing, you can use Promise objects . Promise objects have the methods and properties necessary to perform asynchronous processing.

To use a Promise object, create an instance using the new operator . After that, implement the processing using the then method and catch method.

new Promise((resolve, reject) => {processing body})
…resolve: Function to notify when processing is successful
…reject: Function to notify when processing has failed

Below is a sample of asynchronous processing using Promise objects.

const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

delay(3000)
  .then(() => console.log('Three seconds elapsed!'))
  .catch((error) => console.log(error));

In the above sample, a Promise object is used to display the message “3 seconds have passed!” after 3 seconds.

About the then-catch-finally method

then/ catch/ finallyThree methods are used in Promise objects to define processing for the results of asynchronous processing.

• The then method is executed if the asynchronous process is successful. Pass the function that will be executed when the asynchronous process is successful as an argument to the then method.
• The catch method is executed if the asynchronous process fails. Pass the function that will be executed when the asynchronous process fails as an argument to the catch method.
• The finally method defines the process that will be executed at the end, regardless of whether the asynchronous process succeeds or fails. Pass the function to be executed when the asynchronous process finishes as an argument to the finally method.

By using the above three methods in combination, you can perform appropriate processing depending on the result of the asynchronous processing.

const delay = (ms) => new Promise((resolve, reject) => setTimeout(setTimeout(() => {
    if (ms > 2000) {
      resolve();
    } else {
      reject(new Error('Delay time is too short'));
    }
    }, ms));
    
    delay(3000)
    .then(() => console.log('Three seconds elapsed!'))
    .catch((error) => console.log(error))
    .finally(() => console.log('Asynchronous processing terminated'));

In the above sample, setTimeout is used so that resolve() is called after 3000ms.

If it is more than 3000ms, the then method is called, otherwise the catch method is called, and finally the finally method is called.

summary

“How to implement asynchronous processing using Promise” is summarized below.

By using Promise objects and then/catch/finally methods, you can now easily implement asynchronous processing.

When using Promise objects, you can use a combination of then/catch/finally methods to perform appropriate processing depending on the result of the asynchronous processing.

You can also prevent your application from crashing by using the catch method to define what to do when asynchronous processing fails.