🧠 𝐏𝐫𝐨𝐦𝐢𝐬𝐞.𝐚𝐥𝐥 𝐯𝐬 𝐏𝐫𝐨𝐦𝐢𝐬𝐞.𝐫𝐚𝐜𝐞 – 𝐌𝐮𝐬𝐭 𝐊𝐧𝐨𝐰 𝐟𝐨𝐫 𝐅𝐫𝐨𝐧𝐭𝐞𝐧𝐝 𝐈𝐧𝐭𝐞𝐫𝐯𝐢𝐞𝐰𝐬 🚀 If you're working with async JavaScript, this is a game-changer 👇 🏁 𝐏𝐫𝐨𝐦𝐢𝐬𝐞.𝐚𝐥𝐥 👉 Waits for all promises to resolve 👉 Fails fast if any one rejects const promise1 = Promise.resolve(3); const promise2 = new Promise((resolve) => setTimeout(() => resolve(7), 100)); const promise3 = Promise.resolve(11); Promise.all([promise1, promise2, promise3]).then((values) => { console.log(values); // [3, 7, 11] }); ⚡ 𝐏𝐫𝐨𝐦𝐢𝐬𝐞.𝐫𝐚𝐜𝐞 👉 Returns result of the first settled promise 👉 Doesn’t wait for others const promiseA = new Promise((resolve) => setTimeout(() => resolve('A'), 200)); const promiseB = new Promise((resolve) => setTimeout(() => resolve('B'), 100)); const promiseC = new Promise((_, reject) => setTimeout(() => reject('C'), 300)); Promise.race([promiseA, promiseB, promiseC]) .then((value) => console.log(value)) // B .catch((error) => console.log(error)); 💡 𝐑𝐞𝐚𝐥-𝐰𝐨𝐫𝐥𝐝 𝐮𝐬𝐚𝐠𝐞: Promise.all → Load multiple APIs together Promise.race → Timeout handling / fastest response 🔥 Mastering async patterns = Strong frontend engineering skills #JavaScript #FrontendDeveloper #ReactJS #AsyncJavaScript #Promises #CodingInterview #TechTips #Hiring #FrontendRecruiter #SoftwareEngineering
🏁 Promise.race(promises): Takes an array of Promises and returns a new Promise that settles (resolves or rejects) as soon as the first of the input Promises settles. It doesn't wait for all Promises to complete. const promiseA = new Promise((resolve) => setTimeout(() => resolve('A'), 200)); const promiseB = new Promise((resolve) => setTimeout(() => resolve('B'), 100)); const promiseC = new Promise((reject) => setTimeout(() => reject('C'), 300)); Promise.race([promiseA, promiseB, promiseC]).then((value) => { console.log('Promise.race resolved with:', value); // Output: Promise.race resolved with: B }).catch((error) => { console.log('Promise.race rejected with:', error); });
Promise.all(promises): Takes an array of Promises and returns a new Promise that resolves only when all the input Promises have resolved. If any of the input Promises reject, the Promise returned by Promise.all() will reject with the reason of the first Promise that was rejected. const promise1 = Promise.resolve(3); const promise2 = new Promise((resolve) => setTimeout(() => resolve(7), 100)); const promise3 = Promise.resolve(11); Promise.all([promise1, promise2, promise3]).then((values) => { console.log('Promise.all resolved with:', values); // Output: Promise.all resolved with: [ 3, 7, 11 ] });