DEV Community

Cover image for Understanding Promises in JS
Ashish Kankal
Ashish Kankal

Posted on

Understanding Promises in JS

What are Promises?

Promises are a way of handling asynchronous code in JavaScript. Asynchronous code is code that runs in the background and doesn't return until it's finished. This can be things like loading a web page, fetching data from a database, or making an API call.

Promises let you write code that's more organised and easier to read. They also make it easier to handle errors.

How do Promises Work?

A promise is an object that represents the eventual completion or failure of an asynchronous operation. It has three states: pending, fulfilled, and rejected.

  • When a promise is pending, it hasn't finished yet.
  • When a promise is fulfilled, it has finished successfully.
  • When a promise is rejected, it has finished unsuccessfully.

You can create a promise using the new Promise() constructor. The constructor takes a function as its argument. This function is called the promise's resolver. The resolver function is responsible for setting the promise's state to fulfilled or rejected.

Lets understand the promise by the following example:

const promise = new Promise((resolve, reject) => {
  // Do something asynchronous here.
  // After the execution is finished, call `resolve()` or `reject()`.
});
Enter fullscreen mode Exit fullscreen mode

How to Use Promises?

Once you have a promise, you can use it to do things like:

  • Wait for the asynchronous operation to finish.
  • Check the status of the asynchronous operation.
  • Handle errors that occur during the asynchronous operation.

To wait for the asynchronous operation to finish, you can use the then() method. The then() method takes two functions as its arguments. The first function is called when the promise is fulfilled. The second function is called when the promise is rejected.

Here's an example of how to use the then() and catch() method:

// Resolve a promise with a value
const promise1 = new Promise((resolve, reject) => {
  resolve('Hello, world!!');
});

promise1.then(value => console.log(value)); 
// logs "Hello, world!!"

// Reject a promise with an error
const promise2 = new Promise((resolve, reject) => {
  reject(new Error('Something went wrong'));
});

promise2.catch(error => console.log(error)); 
// logs "Something went wrong"


Enter fullscreen mode Exit fullscreen mode

Conclusion

Promises are a powerful tool for handling asynchronous code in JavaScript. They make your code more organised and easier to read. They also make it easier to handle errors.

If you're new to promises, I encourage you to learn more about them. There are many resources available online, including tutorials, articles, and blog posts.

I hope this blog post has helped you understand promises.

Top comments (0)