Promises in ES6

Facebooktwitterredditpinterestlinkedinmailby feather

Promises in ES6

A promise is used to represent some aspects that are finally fulfilled. It can also be resolved or discarded according to the operational output. In ES6, a promise provides a way to handle asynchronous programming. The promise is also used in JavaScript. The asynchronous programming consists of the processes that are in the execution phase, separated from the main thread. When the process is completed, then it notifies the main thread. Before the concept of promise, the callback functions were responsible for asynchronous programming.

Callback Function

The callback function can be defined as the function execution handler. It handles the function execution after the execution of any other function. We can pass a function as an argument to the other function. The callback function is also used with events.

Need of Promises

The Callback function is suitable for the basic asynchronous operations in programming. If we talk about web application development, then Callback is complicated to handle, because a web application has a huge code. The situation of Callback nesting is called as Callback hell. We can deal with this kind of situation with the help of promises.

Working with Promises

Usually, the promise shows the accomplishment of an asynchronous operation in programming. The promises return the single value according to the operation being executed or discarded.

The promise contains the following three phases, shown in the below figure.

Promises in ES6

Pending Phase: It is the initial phase of the promise. It shows that the output of a promise is computed or not.

Fulfilled: This phase represents that the operation has executed.

Rejected: This phase is used to represent the decline of the execution.

When a promise is being discarded or executed, then it becomes immutable. A promise() constructor obtains resolve or reject arguments, and return the single argument according to the asynchronous operation.

Creating the promise

The promise() constructor is used to construct a promise in ES6. The syntax for creating the promise is given below.

Syntax

Example

Here, we have an example of a promise.

Output

After the execution of the above code, we got the following output:

Promises in ES6

Promise Chaining in ES6

In JavaScript, the promise chaining helps us to control the flow of the asynchronous operations. It also enables us to use a returned value as an input for the other asynchronous operation.

Promises in ES6

For Example

Assume, if we have multiple asynchronous operations for execution. When one operation generates the output, then we will switch to another operation for execution. The promise chaining helps us to handle various asynchronous operations that are interdependent, and each function should be executed one by one.

Here, we have an example to understand the above concept.

Example

Output

After the execution of the code, we can open the console terminal by using ctrl+shift+I, and we got the following output:

Promises in ES6

Method of Promise

The promise method helps us to deal with the resolution or rejection of the promise object. Here, we discuss the promise methods in detail.

.then() method

This method gets invoked at the time of execution or rejection of a promise. The .then() method can be defined as a chained way to execute or reject the promise. We can pass two arguments in the method, such as reject or resolve. This method returns the first argument if the promise is rejected, and second if the promise gets executed.

Example

Here, we have an example to understand the above method.

Output

Promises in ES6

After the execution of the above code, we got the following output:

.all() method

This obtains a promise array as an argument. It returns a resolved promise that executes if all the promises are passed as an iterable that have being executed.

Example

Here, we discussed an example for the above method.

Output

After the execution of the above code, we got the following output:

Promises in ES6

.race() method

This method returns a resolved promise which depends upon the previously resolved promise.

Example

Here, we have an example to understand .race() method.

Output

We got the following output after the execution of the above code.

Promises in ES6

.catch() method

The .catch () method is used to deal with rejections and failures. This method obtains only single arguments to deal with failures.

Example

Here, we discussed an example of the above method.

Output

After the execution of the above code, we got the following output:

Promises in ES6

.resolve() method

The .resolve() method returns a new promise object, resolved by the passed value. If the value includes .then() method, then the promise pursue .then() method.

Example

.reject() method

This method returns the promise object which is rejected with the given value.

Example

Here, we discussed an example of .reject() method.

Output

Promises in ES6

After the successful execution of the above code, we got the following output:

Facebooktwitterredditpinterestlinkedinmailby feather