I have problem in understanding that what happens when we simply return a value or when we return Promise.resolve() from a function. Specifically: I am trying to understand how promises chaining works. I am chaining methods and verifying whether the value reaches in the method which is last call to then. I just want to understand the difference between returning promises to then, returning Promise.resolve() to then, and returning just a value to then.

I have problem in understanding that what happens when we simply return a value or when we return Promise.resolve() from a function. Specifically: I am trying to understand how promises chaining works. I am chaining methods and verifying whether the value reaches in the method which is last call to then. I just want to understand the difference between returning promises to then, returning Promise.resolve() to then, and returning just a value to then.

• javascript
• promise

• I am not concerned about where. It is just what reaches the then function when a promise is resolved or simply a value i returned. – thebedroomprogrammer Commented Nov 14, 2017 at 8:07
• 1 So I am trying to understand how promises chaining works. I am chaining methods and verifying whether the value reaches in the method which is last call to then. I just want to understand the difference between returning promises to then, returning Promise.resolve() to then, and returning just a value to then. - updated – thebedroomprogrammer Commented Nov 14, 2017 at 8:37

3 Answers 3

I have problem in understanding that what happens when we simply return a value or when we return Promise.resolve() from a function.

So there are (at least) two different scenarios:

In just any old function

If it's just any old function (not a then or catch callback), then the difference is that return value; directly returns the value, whereas return Promise.resolve(value); returns a promise fulfilled with that value. It changes how the calling code uses the result. In the return value; case, the calling code just directly uses it. In the return Promise.resolve(value); case, the calling code needs to consume the promise, just like any other promise (and can't assume that the promise is already settled, even though it is).

If the function is meant to be the start of a promise chain, you'd use return Promise.resolve(value);. (There are use cases for this; for instance, if the function may or may not need to start an asynchronous process: In the branch that doesn't have to, you'd still return a promise because the branch that has to do something asynchronous has to return a promise.) If it isn't, you'd just use return value;.

In then or catch callback

I am trying to understand how promises chaining works.

In that case, you're talking about return value; vs. return Promise.resolve(value); in a then or catch callback. That's easy: There's no point at all to return Promise.resolve(value); in a then or catch callback, it's redundant and unnecessary overhead; just use return value;.

then and catch always return promises. If your callback returns a simple value (return value;), the promise is fulfilled with that value. If your callback returns a thenable (loosely, a promise; e.g., return Promise.resolve(value);), then the promise returned by then/catch is resolved to that thenable: When the thenable is settled, the promise is settled the same way. (And if your then or catch callback throws an error, the promise is rejected with that error.)

There are valid reasons to return a promise from a then or catch callback, if you're starting a new asynchronous process in that callback; but if you have an immediate value ready, there's no point in wrapping it in a promise — then and catch already do that.

When you return Promise.resolve(), you wrap your result into a Promise, on which you can call then and make chain of then. This is preferable for a single type returns.

function resolve() {
   return Promise.resolve(15);
}

resolve().then(value => console.log(value));

If you have a logic which depends on a call to the server and also you can have that result in the cache, you can have a function which in all cases returns you a Promise, so you can add then for the result of the Promise. Look at this pseudo-code.

I want my function in all cases return a Promise. So here if I have cached the userId I can just wrap the result into the Promise with Promise.resolve

function getUserData() {
   if(cache.hasUserId) {
      return Promise.resolve(cache.hasUserId); // Is used to let the `then` functions to be called
   } else {
      return myAjaxCall();
   }
}

getUserData().then(userId => /* */);

Base on comment. Wrap into the Promise.resolve()

function add1(data) { 
  return new Promise(function (resolve, reject) { 
               resolve(data + 1); 
         }); 
} 

function add2(data) { 
   return Promise.resolve(data + 2); 
} 

function printdata(data) { 
   console.log(data); 
}

A Promise is a proxy for a value not necessarily known when the promise is created. It allows you to associate handlers with an asynchronous action's eventual success value or failure reason. This lets asynchronous methods return values like synchronous methods: instead of immediately returning the final value, the asynchronous method returns a promise to supply the value at some point in the future. MDN

The Promise.resolve(value) method returns a Promise object that is resolved with the given value. If the value is a thenable (i.e. has a "then" method), the returned promise will "follow" that thenable, adopting its eventual state; if the value was a promise, that object becomes the result of the call to Promise.resolve; otherwise the returned promise will be fulfilled with the value. MDN Promise.reslove

Returning a value from a function is synchronous unlike Promise.resolve()