36 - new promise method: allsettled & any & race

brief introduction

In the previous two articles , We have covered basic and advanced promise knowledge . There are also two nice new operators / Method , It can be that the code is simpler , Let's review them .

allSettled

ES2020 or ES11 Introduced promise.allSettled, So it is a very new method, so you need to be careful when using it . Before using, you need to determine the browser version you want to support .

When all promise Return whether success or failure ,allSettled Will return to one promise. The return value is an array of objects , Each of these describes the input promise The return value of .

allSettled and all There are some differences .

all Will return the entered promise The first is the result of failure , So if we enter 5 individual promise Two of them failed ,all Will return the first failed result .

allSettled Will wait for all promise Complete and return all the results corresponding to the input order . When asynchronous tasks have no dependencies on each other, use allSettled Then retry the failed task . Use if your execution steps depend on all asynchronous tasks all.

const promise1 = Promise.resolve("Parwinder");
const promise2 = new Promise((resolve) => {setTimeout(() => {resolve("Lauren");}, 2000);
});
const promise3 = Promise.reject("Robert");
const promise4 = Promise.resolve("Eliu");

Promise.allSettled([promise1, promise2, promise3, promise4]).then((data) => {console.log(data);
}); 

Once the above four tasks are completed （ Success or failure ）,allSettled Will go to then The result is passed in the callback function of , Print as follows ：

[{status: "fulfilled",value: "Parwinder"
}, {status: "fulfilled",value: "Lauren"
}, {reason: "Robert",status: "rejected"
}, {status: "fulfilled",value: "Eliu"
}] 

any

any The input parameters of are usually iteratable objects such as arrays , It returns the first success in the array promise Result , If all promise If both fail, it returns AggregateError ,AggregateError Is used to combine input promise Independent error returned .

any And all Is relative .

const promise1 = Promise.resolve("Parwinder");
const promise2 = new Promise((resolve) => {setTimeout(() => {resolve("Lauren");}, 2000);
});
const promise3 = Promise.reject("Robert");
const promise4 = Promise.resolve("Eliu");

Promise.any([promise1, promise2, promise3, promise4]).then((data) => {console.log(data); // Parwinder (first successful promise)
}); 

Suppose that all promise All return errors ：

const promise1 = Promise.reject("Parwinder");
const promise2 = new Promise((resolve,reject) => {setTimeout(() => {reject("Lauren");}, 2000);
});
const promise3 = Promise.reject("Robert");
const promise4 = Promise.reject("Eliu");

Promise.any([promise1, promise2, promise3, promise4]).then((data) => {console.log(data); // "AggregateError: No Promise in Promise.any was resolved"
}); 

race

race Will return the first success or failure promise Result .

const promise1 = new Promise((resolve, reject) => {setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {console.log(value);// Both resolve, but promise2 is faster
});
// expected output: "two" 

If passed to race The parameter of is an empty array , There will never be a result ：

var foreverPendingPromise = Promise.race([]);
console.log(foreverPendingPromise);
setTimeout(function(){console.log('the stack is now empty');console.log(foreverPendingPromise);
});

// logs, in order:
// Promise { <state>: "pending" }
// the stack is now empty
// Promise { <state>: "pending" }