Promises Updated

Author: ShubhamSKadam

12_Asynchronous_Concepts/12.md

@@ -7,8 +7,8 @@
 // clearInterval
 
 // outputs Hello, world! Every 2 seconds
- const myInterval = setInterval(() => console.log("Hello, world!"), 2000);
- clearInterval(myInterval); // Clears the Interval
+const myInterval = setInterval(() => console.log("Hello, world!"), 2000);
+clearInterval(myInterval); // Clears the Interval
 
 // setTimeout
 // clearTimeout
@@ -34,7 +34,6 @@ const functionOne = () => {
 const functionTwo = () => {
     console.log("Function two"); // 2
 };
-
 ```
 
 #### Callback functions
@@ -55,14 +54,50 @@ 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.
 
+```js{
+// Let's say we have a shopping cart
+const cart = ['shoes','pants','shirt'];
+
+// If we had to implement a series of operations
+// let's say we have a function to,
+// 1. Create an order which will return a orderID
+// 2. Proceed to payment with orderId and return payment info.
+// 3. Show order summary with payment info
+
+createOrder(cart,(orderID)=>{
+    proceedToPayment(orderID,(paymentInfo)=>{
+        showOrderSummary(paymentInfo,()=>{
+            displayOrderSummary();
+        })
+    }
+})
+// In the above code we see the call back hell or
+// also known as Pyramid of doom
+
+// We can write the same code using promises
+createOrder(cart)
+.then((orderId)=>{
+   return proceedToPayment(orderId)
+})
+.then((paymentInfo)=>{
+    return showOrderSummary(paymentInfo)
+})
+.then(()=>{
+    displayOrderSummary();// not returning anything because we are just displaying
+})
+
+// why do we use promises ?
+// 1. To avoid Inversion of Control [Not calling the fuction over another function]
+// 2. To avoid Call Back hell and have better control of our code
+```
 
+```js
 const fetchUser = (username) => {
     return new Promise((resolve, reject) => {
         setTimeout(() => {
@@ -96,4 +131,3 @@ fetchUser("Shubham")
     .then((photos) => fetchPhotoDetails(photos[0]))
     .then((details) => console.log(`Your photo details are ${details}`));
 ```
-

12_Asynchronous_Concepts/script.js

@@ -37,3 +37,13 @@ const functionTwo = () => {
 };
 
 functionOne();
+
+// callbacks;
+
+const cart = ["Shoes", "Shirt", "Pant"];
+
+const Promise = createOrder(cart);
+
+Promise.then((orderId) => {
+    processPayment(orderId);
+});