Photo by Luca Bravo on Unsplash
Creating a Promise.race() polyfill
A comprehensive explanation to the BigFrontEnd - 35. Implement Promise.race()
Problem Link: bigfrontend.dev/problem/implement-Promise-r..
Continuing the Knowing JS series, with a new question!
First things first, as usual :)
What is a Promise?
An object that represents an eventual completion of failure of an asynchronous operation
What is a polyfill?
A function or a snippet of code that mimics a particular functionality. Created majorly to provide desired functionality in older browsers which don’t support latest, usually higher order operations
What is Promise.race() ?
A static method that takes an iterable of Promises and resolves to the first resolved value of the promise or rejects with the first rejection of the promise. As the name suggests, it races to the first resolution or rejection
Approach
Return a Promise
Iterate over the given promises array
Resolve when any of the promise resolves
Reject when any of the promise rejects
Code Breakdown and explanation
function race(promises) {
// Return a Promise
return new Promise((resolve,reject) => {
// Iterate over the given promises array
promises.forEach((promise) => {
// Resolve the main promise when any of the promise from the array resolved
// Same for reject
Promise.resolve(promise).then(resolve).catch(reject)
})
})
}
And that’s it, race is often the easiest and the most straightforward Promise polyfill to implement, as we just saw, the better we understand the concept, easier it is to implement it