How to consume the Promise value?

What is consuming of Promise values?

Consuming a promise simply means taking the value obtained from the promise to process another operation. After the creation of promises, either resolved value or rejected value will be available in the process.

Promise Methods

There are three methods to consume the promise values.

1. .then( )

2. .catch( )

3. .finally( )

.then( )

The then method allows you to specify a function that should be called when a Promise is fulfilled.

Syntax

Promise.then( callbackfunc(result));

Example

We know that Math.random() is a function in the inbuilt library of Javascript which is used to find a random number between 0(include) and 1(exclude).

We want that if Math.random() outputs a number greater than 0.5, the Promise enters the resolved state. And if Math.random() outputs a number less than 0.5, the promise gets rejected.

We will make a new method then() for that promise.then() function will pass the resolved value as a result. With the help of the result, we will use it to log.

Let's write the code inside HTML so that the states of promise visualize more clearly.

Output:

After running the code in the browser, we can inspect it in the console of the browser.

.catch( )

The catch method is used to handle the rejected value or unsuccessful value. It is used to specify what should happen when a promise is rejected so that we handle the error appropriately in our code.

syntax

Promise.catch(callback(error));

Example

We know that Math.random() is a function in the inbuilt library of Javascript which is used to find a random number between 0(include) and 1(exclude).

We want that if Math.random() outputs a number greater than 0.5, the Promise enters the resolved state. And if Math.random() outputs a number less than 0.5, the promise gets rejected.

We wil make a new method catch() for that promise.catch() function will pass the rejected value as an error. With the help of the error, we will use it to log.

Let's write the code inside HTML so that the states of promise visualize more clearly.

Output:

After running the code in the browser, we can inspect it in the console of the browser.

.finally( )

The finally method is used to specify a function that is executed when the promise is settled(i.e., either resolved or rejected).

syntax

Promise.finally(callback);

Example

We know that Math.random() is a function in the inbuilt library of Javascript which is used to find a random number between 0(include) and 1(exclude).

We want that if Math.random() outputs a number greater than 0.5, the Promise enters the resolved state. And if Math.random() outputs a number less than 0.5, the promise gets rejected.

We will make a new method finally() for that we will know that the promise is finally operated(either resolved or rejected). It will only show a message that the promise is completed finally.

Let's write the code inside HTML so that the states of promise visualize more clearly.

Output:

After running the code in the browser, we can inspect it in the console of the browser.