Cancel JavaScript Promise

I am trying to cancel a promise as given below:

function example(cancel = Promise.reject()) {
return new Promise((resolve, reject) => {
const timer = setTimeout(() => resolve('jack-jack'), 5000);
cancel.then((res) => {
clearTimeout(timer);
reject('cancelled');
}, ()=>{})
});
}
var cancel=Promise.reject();
example(cancel).then((res) => console.log('res handled:' + res)).catch((err) => console.log('err handled:' + err));
console.log('attempting cancellation of promise');
cancel=Promise.resolve();


However I am not able to cancel it. What am I doing wrong over here?

cancel

cancel.then()

4 Answers
4

You’ve assigned a rejected promise to a variable, passed the rejected promise into your function, and assigned a resolved promise to the variable. The two values the variable takes on are unrelated, and you can’t change the state of a settled promise.

Pass in a promise you can resolve:

let cancel;
let cancelPromise = new Promise((resolve) => {
cancel = resolve;
});

example(cancelPromise).then(…).catch(…);
console.log('attempting cancellation of promise');
cancel();


function example(cancel = Promise.reject()) {
return new Promise((resolve, reject) => {
const timer = setTimeout(() => resolve('jack-jack'), 5000);
cancel.then((res) => {
clearTimeout(timer);
reject('cancelled');
}, ()=>{})
});
}

let cancel;
let cancelPromise = new Promise((resolve) => {
cancel = resolve;
});

example(cancelPromise)
.then((res) => console.log('res handled:' + res))
.catch((err) => console.log('err handled:' + err));
console.log('attempting cancellation of promise');
cancel();

In your code you pass already a complete (rejected) Promise to the function. And cancel=Promise.resolve(); after attempting cancellation of promise won't have any effect to promise that was passed to example because you just create a new resolved Promise.

cancel=Promise.resolve();

attempting cancellation of promise

example

If you want to cancel a running process then you might want choose such a solution:

function example(helper) {
return new Promise((resolve, reject) => {
helper.cancel = function() {
clearTimeout(timer)
reject('cancelled');
}
const timer = setTimeout(() => resolve('jack-jack'), 5000);

});
}
var helper = {};
example(helper).then((res) => console.log('res handled:' + res)).catch((err) => console.log('err handled:' + err));

console.log('attempting cancellation of promise');
helper.cancel()


Since the cancel is set to reject, the then part

cancel.then((res) => { //you cannot use then for reject, as reject cannot be resolved.
clearTimeout(timer);
reject('cancelled');
}, ()=>{})


will never gets executed hence you have to resolve it, not reject it

function example(cancel = Promise.reject()) {
return new Promise((resolve, reject) => {
const timer = setTimeout(() => resolve('jack-jack'), 5000);
cancel.then((res) => { //you cannot use then for reject
clearTimeout(timer);
reject('cancelled');
}, ()=>{})
});
}

var cancel = Promise.resolve(); // just change to resolve

example(cancel).then((res) => console.log('res handled:' + res)).catch((err) => console.log('err handled:' + err));

console.log('attempting cancellation of promise');
cancel=Promise.resolve(); // this will have no effect as you have already passed a reject

example

example

Because you are passing rejected promise. Pass the resolved promise if you want cancel.then() block to run.

cancel.then()

function example(cancel = Promise.resolve()) {
return new Promise((resolve, reject) => {
console.log(cancel);
const timer = setTimeout(() => {
resolve('jack-jack'), 5000
});
cancel.then((res) => {
console.log('CANCELLED');
clearTimeout(timer);
reject('cancelled');
}, () => {})
});
}
var cancel = Promise.resolve();
example(cancel).then((res) => console.log('res handled:' + res)).catch((err) => console.log('err handled:' + err));
console.log('attempting cancellation of promise');
cancel = Promise.resolve();

example

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.