Topic: JS Promise vs Async await

As JavaScript is an Asynchronous(behaves synchronously), we need to use callbacks, promises and async await. You need to learn what is async-await, what is promise, how to use promise and async-await in javascript and where to use it.

Promise

• What is Promise? A Promise is a rejected value or succeeded value of asynchronous function and when the operation is not fulfilled or fulfilled and thus promise is created.

Promise have three states.

1. pending: initial state, neither fulfilled nor rejected.
2. fulfilled: meaning that the operation was completed successfully.
3. rejected: meaning that the operation failed.

How to use Promise? See the example below

const calculate = (a,b,c) => { 
  return new Promise((resolve, reject) => {
  setTimeout(() => {
    if(a<0 || b<0 || c||0){
       reject("no number can be negative.")
    }
    resolve('Calculation: ', a+b+c);
  }, 1000);
 }
}

calculate(5,7,8);
.then((reolveOfCalculate)=>{
  console.log(reolveOfCalculate);
}.catch((rejectOfCalculate)=>{
  console.log("rejectOfCalculate");
})

From above example, I am trying to give a little explanation about promise. A promise is created in calculate function. When the operation of the function is fulfilled then, it calls a callBack function and the success value is kept in resolve argument. Similarly, a callBack function is called, and the failure value is kept in reject argument when the operation is not fulfilled.
The success and rejected value is consoled by taking an argument respectively reolveOfCalculate, rejectOfCalculate.

Promise can be written in chaining. See below...

const calculate = (a,b,c) => { 
  return new Promise((resolve, reject) => {
  setTimeout(() => {
    if(a<0 || b<0 || c||0){
       reject("no number can be negative.")
    }
    resolve('Calculation: ', a+b+c);
  }, 1000);
 }
}

calculate(5,7,8);
.then((reolveOfCalculate)=>{
  console.log(reolveOfCalculate);
  return (reolveOfCalculate, 3, 2);
}.then((chaining1)=>{
  console.log(chaining1);
}).catch((rejectOfCalculate)=>{
  console.log("rejectOfCalculate");
})

Async await

Async await is the lighter version of promises. Because, basically promises works behind the await methods. The await operator is used to wait for a Promise. It can only be used inside an async function within regular JavaScript code.

Return value:

Returns the fulfilled value of the promise, or the value itself if it's not a Promise.

const calculate = (a,b,c) => { 
  return new Promise((resolve, reject) => {
  setTimeout(() => {
    if(a<0 || b<0 || c||0){
       reject("no number can be negative.")
    }
    resolve('Calculation: ', a+b+c);
  }, 1000);
 }
}

const add = () => {
   const sum1 = await calculate(1,2,3);
   const sum2 = await calculate(sum1,2,3);
   return sum2;
}
add().then((result)=>{console.log(result)}).catch((error)=>{console.log(error)};

Why to use Async await:

Async await is cleaner than promises. So, most of the programmers suggest to use async await to make our code readable and cleaner.