Promises in JavaScript: Understanding Asynchronous Code Execution

Mohit Gadhavi
2 min readMar 21, 2023

In the world of web development, asynchronous code execution is a common requirement. JavaScript, being the primary language for web development, offers a solution to execute asynchronous code through Promises. Promises are a built-in feature of JavaScript, which allows developers to write asynchronous code in a more organized and readable way.

What is a Promise in JavaScript?

A Promise is an object that represents the eventual completion (or failure) of an asynchronous operation and its resulting value. A Promise can be in one of three states:

  1. Pending: The Promise is not fulfilled or rejected yet.
  2. Fulfilled: The Promise is fulfilled, meaning the operation completed successfully, and the Promise has a resulting value.
  3. Rejected: The Promise is rejected, meaning the operation encountered an error, and the Promise has a reason for the rejection.

A Promise has two main methods: then() and catch(). The then() method is called when a Promise is fulfilled, while the catch() method is called when a Promise is rejected. Both methods receive a callback function as an argument, which is executed when the Promise changes its state.

Using Promises in JavaScript

To create a Promise in JavaScript, we use the Promise constructor. The constructor takes a single argument, which is a callback function with two parameters: resolve and reject. The resolve parameter is used to fulfill the Promise, while the reject parameter is used to reject the Promise.

Here is an example of creating a Promise:

const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Operation completed successfully!');
}, 2000);
});

In the above example, the Promise is created using the Promise constructor. The setTimeout() function is used to simulate an asynchronous operation that takes 2 seconds to complete. When the operation is completed, the Promise is fulfilled with the string value “Operation completed successfully!”.

To handle the fulfilled or rejected state of a Promise, we use the then() and catch() methods, respectively. Here is an example:

promise
.then((result) => {
console.log(result);
})
.catch((error) => {
console.error(error);
});

In the above example, we use the then() method to handle the fulfilled state of the Promise. The result parameter of the callback function contains the resulting value of the Promise. We use the console.log() method to print the result to the console.

We use the catch() method to handle the rejected state of the Promise. The error parameter of the callback function contains the reason for the rejection. We use the console.error() method to print the error to the console.

Conclusion

Promises are a powerful feature of JavaScript, which enables developers to write asynchronous code in a more organized and readable way. By using Promises, we can avoid the callback hell and write more maintainable code. Promises are widely used in modern web development frameworks like React, Angular, and Vue.js. Understanding Promises is essential for any JavaScript developer who wants to write efficient and scalable code.

--

--