Why does a `.then` callback following a `.catch` get executed?

Question

Problem: last 2 .then are getting called even while I am returning Promise.reject(). The 1st .then() is printing undefined and 2nd .then() is also printing the output.

Can someone please explain why?

let p4 = new Promise((resolve,reject)=>{
    resolve("p4 Resolved");
});

p4.then((val)=>{
    console.log(val);
    return Promise.reject("20 Rejected")
}).catch((error)=>{console.log(error)})
  .then((val)=>{console.log(val);return 290})
  .then((val)=>{console.log("Last then : "+val);});

Answer 1

catch also returns a promise and since you didn't return anything, it will be a promise that fulfills to undefined, therefore the first then prints undefined. Finally, the last then gets the value 290 from the previously returned promise by the first then and prints it.

Answer 2

.catch() returns a new pending Promise:

Returns a new Promise. This new promise is always pending when returned, regardless of the current promise's status. It's eventually rejected if onRejected throws an error or returns a Promise which is itself rejected; otherwise, it's eventually fulfilled. — Promise#catch(), Return value | MDN

The first .then() returns a rejected promise, which as you expect, calls .catch(). However, since the callback passed to it as argument (error => { console.log(error) }) doesn't throw any errors, the new promise will be fulfilled and therefore it will call all the subsequent .then()s.