|
| 1 | +const promiseOne = new Promise(function (resolve, reject) { |
| 2 | + //Do an async task |
| 3 | + // DB calls, cryptography, network |
| 4 | + setTimeout(function () { |
| 5 | + console.log("Async task is completed!"); |
| 6 | + resolve(); |
| 7 | + }, 1000); |
| 8 | +}); |
| 9 | + |
| 10 | +// resolve is connected with `.then` |
| 11 | +promiseOne.then(function () { |
| 12 | + console.log("Promise consumed!"); |
| 13 | +}); |
| 14 | + |
| 15 | +// new promise without storing function in variable |
| 16 | +new Promise(function (resolve, reject) { |
| 17 | + setTimeout(function () { |
| 18 | + console.log("Async task 2!"); |
| 19 | + resolve(); |
| 20 | + }, 1000); |
| 21 | +}).then(function () { |
| 22 | + console.log("Async 2 resolved!"); |
| 23 | +}); |
| 24 | + |
| 25 | +// promise with storing function in variable and passing parameters to `.then` |
| 26 | +const promiseThree = new Promise(function (resolve, reject) { |
| 27 | + setTimeout(function () { |
| 28 | + resolve({ username: "Dummy", email: "dummy@example.com" }); |
| 29 | + }, 1000); |
| 30 | +}); |
| 31 | + |
| 32 | +// passing `user` argument to `.then` from `promise` parameters |
| 33 | +promiseThree.then(function (user) { |
| 34 | + console.log(user); |
| 35 | +}); |
| 36 | + |
| 37 | +// promise with error (reject) |
| 38 | +const promiseFour = new Promise(function (resolve, reject) { |
| 39 | + setTimeout(function () { |
| 40 | + let error = true; |
| 41 | + if (!error) { |
| 42 | + resolve({ username: "chinmay", password: "123" }); |
| 43 | + } else { |
| 44 | + reject("ERROR: Something went wrong"); |
| 45 | + } |
| 46 | + }, 1000); |
| 47 | +}); |
| 48 | + |
| 49 | +// promise `.then` chaining with `.catch` and `.finally` |
| 50 | +promiseFour |
| 51 | + .then((user) => { |
| 52 | + console.log(user); |
| 53 | + return user.username; |
| 54 | + }) |
| 55 | + .then((username) => { |
| 56 | + console.log(username); |
| 57 | + }) |
| 58 | + .catch(function (error) { |
| 59 | + console.log(error); |
| 60 | + }) |
| 61 | + .finally(() => console.log("The promise is either resolved or rejected")); |
| 62 | + |
| 63 | +// handling promises with async functions |
| 64 | +const promiseFive = new Promise(function (resolve, reject) { |
| 65 | + setTimeout(function () { |
| 66 | + let error = true; |
| 67 | + if (!error) { |
| 68 | + resolve({ username: "javascript", password: "123" }); |
| 69 | + } else { |
| 70 | + reject("ERROR: JS went wrong"); |
| 71 | + } |
| 72 | + }, 1000); |
| 73 | +}); |
| 74 | + |
| 75 | +// handling promise with async function |
| 76 | +async function consumePromiseFive() { |
| 77 | + try { |
| 78 | + const response = await promiseFive; |
| 79 | + console.log(response); |
| 80 | + } catch (error) { |
| 81 | + console.log(error); |
| 82 | + } |
| 83 | +} |
| 84 | + |
| 85 | +consumePromiseFive(); |
| 86 | + |
| 87 | +// async function getAllUsers() { |
| 88 | +// try { |
| 89 | +// const response = await fetch("https://jsonplaceholder.typicode.com/users"); |
| 90 | + |
| 91 | +// const data = await response.json(); |
| 92 | +// console.log(data); |
| 93 | +// } catch (error) { |
| 94 | +// console.log("E: ", error); |
| 95 | +// } |
| 96 | +// } |
| 97 | + |
| 98 | +// getAllUsers(); |
| 99 | + |
| 100 | +fetch("https://api.github.com/users/ChinmayKaitade") |
| 101 | + .then((response) => { |
| 102 | + return response.json(); |
| 103 | + }) |
| 104 | + .then((data) => { |
| 105 | + console.log(data); |
| 106 | + }) |
| 107 | + .catch((error) => console.log(error)); |
| 108 | + |
| 109 | +// promise.all ✅ |
| 110 | +// In JavaScript, `Promise.all` is a method that takes an array (or any iterable) of promises and returns a single promise that resolves when all of the promises in the array have resolved. If any of the promises in the array reject, the returned promise will immediately reject with that reason. |
| 111 | + |
| 112 | +// How `Promise.all` Works: |
| 113 | + |
| 114 | +// 1. Resolves when all promises resolve: If all the promises resolve, `Promise.all` resolves with an array of the resolved values, in the same order as the promises in the input array. |
| 115 | + |
| 116 | +// 2. Rejects if any promise rejects: If any promise in the array rejects, `Promise.all` immediately rejects with the reason from the first promise that rejects, and ignores the results of the other promises. |
| 117 | + |
| 118 | +// Example1: |
| 119 | +const promise1 = new Promise((resolve, reject) => { |
| 120 | + setTimeout(() => resolve("First Promise Resolved"), 1000); |
| 121 | +}); |
| 122 | + |
| 123 | +const promise2 = new Promise((resolve, reject) => { |
| 124 | + setTimeout(() => resolve("Second Promise Resolved"), 2000); |
| 125 | +}); |
| 126 | + |
| 127 | +const promise3 = new Promise((resolve, reject) => { |
| 128 | + setTimeout(() => resolve("Third Promise Resolved"), 1500); |
| 129 | +}); |
| 130 | + |
| 131 | +Promise.all([promise1, promise2, promise3]) |
| 132 | + .then((results) => { |
| 133 | + console.log("All promises resolved:", results); |
| 134 | + }) |
| 135 | + .catch((error) => { |
| 136 | + console.error("One of the promises rejected:", error); |
| 137 | + }); |
| 138 | + |
| 139 | +// Explanation: |
| 140 | + |
| 141 | +// - Promises: |
| 142 | +// - `promise1` resolves after 1 second. |
| 143 | +// - `promise2` resolves after 2 seconds. |
| 144 | +// - `promise3` resolves after 1.5 seconds. |
| 145 | + |
| 146 | +// - `Promise.all([promise1, promise2, promise3])`: |
| 147 | +// - Waits for all three promises to resolve. |
| 148 | +// - After 2 seconds (when the longest promise, `promise2`, resolves), the `then` block is executed. |
| 149 | +// - The `results` array contains: `['First Promise Resolved', 'Second Promise Resolved', 'Third Promise Resolved']`. |
| 150 | + |
| 151 | +// Handling Rejections: |
| 152 | + |
| 153 | +// If one of the promises rejects, `Promise.all` will immediately reject. |
| 154 | +const promise4 = new Promise((resolve, reject) => { |
| 155 | + setTimeout(() => resolve("First Promise Resolved"), 1000); |
| 156 | +}); |
| 157 | + |
| 158 | +const promise5 = new Promise((resolve, reject) => { |
| 159 | + setTimeout(() => reject("Second Promise Rejected"), 2000); |
| 160 | +}); |
| 161 | + |
| 162 | +const promise6 = new Promise((resolve, reject) => { |
| 163 | + setTimeout(() => resolve("Third Promise Resolved"), 1500); |
| 164 | +}); |
| 165 | + |
| 166 | +Promise.all([promise4, promise5, promise6]) |
| 167 | + .then((results) => { |
| 168 | + console.log("All promises resolved:", results); |
| 169 | + }) |
| 170 | + .catch((error) => { |
| 171 | + console.error("One of the promises rejected:", error); |
| 172 | + }); |
| 173 | + |
| 174 | +// In this case, after 2 seconds, `promise2` will reject, causing `Promise.all` to reject immediately with the error `'Second Promise Rejected'`. The other promises are ignored after the rejection. |
| 175 | + |
| 176 | +// When to Use `Promise.all`: |
| 177 | +// - When you want to wait for multiple asynchronous operations to complete before proceeding. |
| 178 | +// - When you need all promises to succeed, and want to handle failure if any of them fail. |
| 179 | + |
| 180 | +// This method is useful when you want to run multiple asynchronous tasks in parallel and wait for all of them to complete. |
0 commit comments