Promises.js

/* PROMISES--> to overcome the issue of callback hells.
Promise is for "eventual" completion of task
resolve and reject are callbacks provided by JS 

** 3 STATES OF PROMISES **
1- Pending --> no final result is received/ the result is undefined
2- Fulfilled --> final result is received/ the result is a value (fulfilled)
3- Rejected --> an error occured and result can't be generated/ the result is an error object

Generally, we do not create promises, they are generated by APIs, and we need to handle them
*/

let promise = new Promise((resolve, reject) => {
  console.log("Promise");
  resolve("Success"); // to fulfill promise
  // reject("Rejected"); //to generate error
});

/*
** state will be pending for this even when the data is printed coz we haven't resolved it **
let getData = (dataId, getNextData) => {
    return new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log("data", dataId);
        if (getNextData) {
        getNextData();
        }
    }, 5000);
});
};
*/

//RESOLVING CALLBACK HELL USING PROMISES

let getData = (dataId, getNextData) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("data", dataId);
      resolve("Success");
      if (getNextData) {
        getNextData();
      }
    }, 3000);
  });
};

// PROMISE CHAIN
getData(1).then((res)=>{
    console.log(res);
    getData(2).then((res) => {
      console.log(res);
    });
});

//Another way of writing Promise Chain or known as chain of .then 
getData(1)
  .then((res) => {
    return getData(2);
  })
  .then((res) => {
    return getData(3);
  })
  .then((res) => {
    console.log(res);
});


// // *************************************************************************** //
/* HOW TO USE PROMISES
.then()--> fulfill hony ky baad koi kaam krawana
.catch()--> reject hony ky baad koi kaam krawana */

const getPromise = () => {
  return new Promise((resolve, reject) => {
    console.log("Promise");
    // resolve("Success");
    reject("Failure"); //msg for rejection will be written in parentheses
  });
};

// For Resolve Promise
let promisee = getPromise();
promisee.then((res)=>{
    console.log("Promise fulfilled", res); //this won't work in case of reject promise
});

// For Reject Promise
promisee.catch((err)=>{
    console.log("Promise rejected", err);
});

// *************************************************************************** //
function asyncFun1() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Data1");
      resolve("Success!");
    }, 2000);
  });
}

function asyncFun2() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Data2");
      resolve("Success!");
    }, 2000);
  });
}

{
console.log("Fetching Data1...");
let p1= asyncFun1();
p1.then((res)=>{
    console.log(res);
});

console.log("Fetching Data2...");
let p2= asyncFun2();
p2.then((res)=>{
    console.log(res);
});
}

/* OUTPUT
Fetching Data1...
Fetching Data2...
Data1
Success!
Data2   
Success!
*/

/*****************************************************************/
//WE WANT THAT ONCE THE EXECUTION FOR DATA 1 IS COMPLETED THEN DATA 2 STARTS TO EXECUTE. FOR THAT WE CAN DO CHAINING
console.log("Fetching Data1...");
let p1 = asyncFun1();
p1.then((res) => {
  console.log(res);
  console.log("Fetching Data2...");
  let p2 = asyncFun2();
  p2.then((res) => {
    console.log(res);
  });
});

// To Simplify Code 
console.log("Fetching Data1...");
asyncFun1().then((res) => {
  console.log(res);
  console.log("Fetching Data2...");
  asyncFun2().then((res) => {
    console.log(res);
  });
});