Introduction
Promise is used to improve the asynchronous calls in JavaScript.This article is the note for reviewing some properties of Promise
1. Promise object
- Promise takes two callback functions as arguments: resolve and reject
new Promise((resolve, reject) => {
setTimeout(() => {
if (isResolved) {
resolve('resolved');
} else {
reject('rejected');
}
}, 300);
});
2. Promise object has three kind of state
The source of the following figure is MDN
- Pending
- Fulfilled(resolved): the resolve function will be triggered
- Rejected: the reject will be triggered
- Settled: Something happened
Example for resolving Promise objects in different states
const myPromise = (isResolved) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (isResolved) {
resolve('resolved');
} else {
reject('rejected');
}
}, 300);
});
}
myPromise(true)
.then((value) => {
console.log(value);
})
.catch((value) => {
console.log('something wrong');
});
//resolved
myPromise(false)
.then((value) => {
console.log(value);
})
.catch((value) => {
console.log('something wrong');
});
//something wrong
3. Run multiple Promise objects serially
- The example of the promise chain
myPromise(true)
.then((value) => {
console.log(value);
return myPromise(false)
})
.then((value) => {
console.log(value);
})
.catch((value) => {
console.log('something wrong');
});
//resolved
//something wrong
4. Run multiple Promises at once (method 1: Promise.all)
The properties of Promise.all:
- Finish when all promises are resolved or one promise is rejected
- Promise.all will be resolved when all promises are fulfilled
- Promise.all will be rejected when one promise is resolved
const myPromise = (isResolved) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (isResolved) {
resolve('resolved');
} else {
reject('rejected');
}
}, 300);
});
}
var r = Promise.all([
myPromise(false),
myPromise(true)
])
.then(values => {
console.log(values);
//no out put
});
- Check the state of the Promise.all object. It's rejected.
console.log(r)
- we can see that the state is rejected
5. Run multiple Promises at once (method 1: Promise.allSettled)
The properties of Promise.allSettled:
- The Promise.allSettled() method returns a promise that resolves after all of the given promises have either fulfilled or rejected, with an array of objects that each describes the outcome of each promise.
const myPromise2 = (isResolved) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (isResolved) {
resolve('resolved');
} else {
reject('rejected');
}
}, 300);
});
}
var r = Promise.allSettled([
myPromise2(false),
myPromise2(true)
])
.then(values => {
console.log(values);
});
//Array [Object { status: "rejected", reason: "rejected" }, Object { status: "fulfilled", value: "resolved" }]
- Check the state of the Promise.all object. It's fulfilled.
console.log(r)
Articles
There are some of my articles. Feel free to check if you like!
- My blog-posts for software developing: https://medium.com/a-layman
- My web resume: https://jenhsuan.github.io/ALayman/cover.html
- Facebook page: https://www.facebook.com/imalayman
- Twitter bot: https://twitter.com/ALayman84368087
Top comments (0)