YogeshChauhan . com

What is a “promise” in JavaScript?

in JavaScript on April 24, 2021

A JavaScript standard class Promise is asynchronous action that might get completed at a certain point and produce a success or failure. It notifies when the value is available.

How to create a promise?

Quick and easy way to do it to call Promise.resolve to create a promise and get a value wrapped in a promise. You can also create a constructor.

If it’s a promise then you get the value returned and if not, it creates a new promise with the passed value as it’s result.

After that you can use then method to get the result of the promise. then method registers a callback function which gets called when the promise resolves and at the end it produces a value.

A promise is a kinda assurance that you’ll get some value in the future.

Example


let greet = Promise.resolve("hello");
greet.then(value => console.log(`Saying ${value}`));
// "Saying hello"

Promise states

A pending state is an initial state which indicates that the result is still pending, it’s not fulfilled or rejected. Other two states are fulfilled (operation completed successfully) and rejected (operation failed).

Can you add multiple callbacks to a single promise?

Yes, you can add multiple callbacks to a single promise.

In fact, you can add then even after the promise has been completed. All callbacks will be called.

then method can return another promise and the value the handler function returns and the loop continues. So, if the handler function returns another promise then it’s going to wait till that promise resolves a value.

Promise as a constructor

We can also use Promise as a constructor which expects a function as an argument.

A simple example


const greet = new Promise((resolve, reject) => {
    resolve('hello');
});

greet.then((value) => {
  console.log(`Saying ${value} again!`);
});

// "Saying hello again!"

Promise constructor with setTimeout


let promiseEx = new Promise(function(resolve, reject) {
  setTimeout(function() {
    resolve("Promise request resolved!");
  }, 1000);
});

promiseEx.then(function(value) {
  console.log(value);
});

//"Promise request resolved!"

dreamhost

Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #3 How to uninstall Cocoapods from the Mac OS? #4 How to add Read More Read Less Button using JavaScript? #5 How to Use SQL MAX() Function with Dates? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

May 5 Use inline if to make a shorter conditional syntax in React May 4 What is Conditional Rendering in React? May 3 How does @extend rule work in SCSS (Sass)? May 2 How different is Handling Events in React vs HTML DOM? May 2 How to create bouncing balls using HTML canvas and JavaScript? Apr 30 HTML canvas methods

You might also like these

New to ┬áDrupal? Here’s What You Need to KnowDrupalIs there a way to do a FULL OUTER JOIN in MySQL?SQL/MySQLAggregate Functions Examples in Postgres for BeginnersPostgresHow to add a scroll back to top button using JavaScript and CSS?CSSHow to Block IPs and User Agents using code in Drupal or WordPress?DrupalWhat is Conditional Rendering in React?React