Promises

Author: ShubhamSKadam

12_Asynchronous_Concepts/12.md

@@ -53,3 +53,47 @@ fetchUser("Shubham", (user) => {
 });
 ```
 
+#### Promises
+
+```js
+//In JavaScript, a Promise is an object that represents the result of an asynchronous //operation. A Promise can be in one of three states: pending, fulfilled, or rejected.
+
+//A Promise starts in the pending state, and it can either be fulfilled with a value or //rejected with a reason (error). Once a Promise is fulfilled or rejected, it is considered //settled, and it cannot be changed anymore.
+
+//Promises are used to handle asynchronous operations in a synchronous manner, making it //easier to write and reason about async code. Instead of using callback functions, you can //use the then and catch methods on a Promise to specify what should happen when the Promise //is fulfilled or rejected.
+
+
+const fetchUser = (username) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log("[Now we have the user]");
+
+            resolve({ username });
+        }, 2000);
+    });
+};
+
+const fetchUserPhotos = (username) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log(`Now we have the photos for ${username}`);
+            resolve(["Photo1", "Photo2"]);
+        }, 2000);
+    });
+};
+
+const fetchPhotoDetails = (photo) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log(`[Now we have the photo details ${photo}]`);
+            resolve("details...");
+        }, 2000);
+    });
+};
+
+fetchUser("Shubham")
+    .then((user) => fetchUserPhotos(user.username))
+    .then((photos) => fetchPhotoDetails(photos[0]))
+    .then((details) => console.log(`Your photo details are ${details}`));
+```
+

12_Asynchronous_Concepts/script2.js

@@ -1,12 +1,32 @@
-// Callback functions
+const fetchUser = (username) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log("[Now we have the user]");
 
-const fetchUser = (username, callback) => {
-    console.log("Fetching...");
-    setTimeout(() => {
-        callback({ username });
-    }, 2000);
+            resolve({ username });
+        }, 2000);
+    });
 };
 
-fetchUser("Shubham", (user) => {
-    console.log(`Hello, ${user.username}`);
-});
+const fetchUserPhotos = (username) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log(`Now we have the photos for ${username}`);
+            resolve(["Photo1", "Photo2"]);
+        }, 2000);
+    });
+};
+
+const fetchPhotoDetails = (photo) => {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log(`[Now we have the photo details ${photo}]`);
+            resolve("details...");
+        }, 2000);
+    });
+};
+
+fetchUser("Shubham")
+    .then((user) => fetchUserPhotos(user.username))
+    .then((photos) => fetchPhotoDetails(photos[0]))
+    .then((details) => console.log(`Your photo details are ${details}`));