what is being promised in the promise returned by .then ( ) method?

Question

My question id related to Javascript promises. The promise constructor allows us to write the logic to resolve or reject. For example

let x = true;
const promise1 = new Promise(function(resolve, reject) {  
if (x == true){                              // Reject - Resolve logic 
    resolve('Success!');
  }
else {
    reject('Reject');
  }
});

But now if I chain it with a .then ( () => console.log('Hello')) , how does it get accepted or rejected without provided logic?

promise1.then(() => console.log('Hello') , undefined)
        .then(undefined , () => console.log('World'))
        .catch( () => console.log('Error'));

My question is:

1. new Promise is either accepted or rejected and then the .then()'s onFullilled or onRejected is called. Also, .then() returns a new Promise. So, what is being promised in the returned promise by .then()?

2. Where do I provide the logic to either resolve or reject the promise returned by .then()? (Like I did in the constructor above)

Also, According to my knowledge - The functions resolve and reject are already present in JS and they mutate the Promise state

Thanks

Did you mean to omit the `else` in your `if (x == true)`, meaning it will both resolve **and** reject when x is true? — Wyck, Jan 10 '20 at 05:13
@Wyck a resolved promise cannot be rejected. `console.assert(true === await new Promise((resolve, reject) => { resolve(true); reject(false)}))` — BlueWater86, Jan 10 '20 at 05:16
@BlueWater86 Good style not to reject after resolving: See https://stackoverflow.com/questions/32536049/do-i-need-to-return-after-early-resolve-reject It **was** a typo. See lynxx's comment. — Wyck, Jan 10 '20 at 05:18
Agreed. Just wanted to point out that a promise cannot be both resolved and rejected. — BlueWater86, Jan 10 '20 at 05:19
@BlueWater86 For sure. I made the comment because it helps to avoid putting focus on the behaviour of calling `reject` after calling `resolve`, which is irrelevant for this question. The intent of the question is more concise now. — Wyck, Jan 10 '20 at 05:23
Perhaps answered [here](https://stackoverflow.com/a/43155226/1563833) The magic of `then` is that If you return something value-like, then it returns a promise that resolves with the value. If you return something promise-like then it returns the promise. — Wyck, Jan 10 '20 at 05:31

score 1 · Answer 1 · answered Jan 10 '20 at 05:21

1

A picture is worth 1000 words:

answered Jan 10 '20 at 05:21

David

15,894
22
55
66

That picture (and the 1000 words it stands in for) is not related to the question at all, which asks about the `.then()` method – Bergi Jul 11 '23 at 20:59

score 0 · Answer 2 · answered Jan 10 '20 at 05:17

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

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

promise1(1)
 .then(data => promise2(data))
 .then(data => console.log(data));

score 0 · Answer 3 · answered Jan 10 '20 at 05:43

As you correctly mentioned a promise always returns a new promise. That can be either in pending or resolved state.

Further if it resolves, it can either be rejected with a reason (meaning promise didn't did what it was supposed to do) or resolved with a value (meaning promise successfully completed its task).

let x = true;
const promise1 = new Promise(function(resolve, reject) {  
if (x === true){                              
    resolve('Success!');
  }
else {
    reject('Reject');
  }
});

Now, if you use this promise somewhere like,

promise2 = promise1.then(val => {
  console.log(val); //logs "Success!"
  return "resolved value for promise2"
})

Further,

promise3 = promise2.then(val => {
  console.log(val); //logs "resolved value for promise2"
  return "some resolved value"
})

Now going back to the constructor function, for x=false,

promise2 = promise1.catch(err => {
  console.log(err) //logs "Reject";
  return "resolved value from catch block";
}) 

promise3 = promise2.then(val => {
  console.log(val); //logs "resolved value from catch block"
  return "some resolved value"
})

or you can throw an error so as to propagate it,

promise2 = promise1.catch(err => {
  console.log(err) //logs "Reject";
  throw "rejected value from catch";
}) 

promise3 = promise2.catch(val => {
  console.log(val); //logs "rejected value from catch"
  throw err;
})

Important part is if you are throwing or returning from catch block? Read more on docs.

what is being promised in the promise returned by .then ( ) method?

3 Answers3