Promise in javascript

Promise is used to handle asynchronous code in a more organized and readable way.

Lets understand the concept first.

Assume a case where i have to write 3 pages of assignment.

When i am alone, i will write these pages one by one, i.e. 1st page then 2nd page then 3rd page.

Now consider i have my best friend with me.

In that case i will ask him to complete the 2nd page. so now i will be doing 1st page and 3rd page and my friend will be doing the 2nd page and once my friend is done with the task he will inform me.

It is like my friend Promise me to give the response about the task And as he is my best friend I know he will surely do ;)

In above case, either of the three conditions will be present.

1)My friend completes the task ----->resolve

2)My friend cant able to complete the task ----->reject

3)My friend is still doing the task ----->pending

Once i get response from my friend, I will decide my next steps.

Promise is your friend in above scenario. Lets understand the code now.

console.log("Before Promise");

let value = 10;

const myPromise = new Promise((resolve,reject)=>{
    if(value == 10){
        resolve("Its 10");
    }else{
        reject("Its Not 10")
    }
});

myPromise.then((response)=>{
    console.log(response)
}).catch((err)=>{
    console.log(err)
})

console.log("After Promise");        

Output will be:

Before Promise
After Promise
Its 10        

Always remember that its an asynchronous code, so the output of the promise will always be printed after the synchronous stack is completed.

Even if the promise is resolved before the completion of current synchronous stack, its output will not be printed immediately but wait for the completion of synchronous stack.

lets understand in code

console.log("Before Promise");

let value = 10;

const myPromise = new Promise((resolve,reject)=>{
    if(value == 10){
        resolve("Its 10");
    }else{
        reject("Its Not 10")
    }
});

myPromise.then((response)=>{
    console.log(response)
}).catch((err)=>{
    console.log(err)
})

for (let i=0; i<10000000; i++){
    //some code
}

console.log("After Promise");        

in above code, even if the promise is resolved before the completion of for loop, it will wait for for loop to complete and "After Promise" to be printed and once "After Promise" is printed, the promise output will be consoled.

Though promise and callbacks are different, you can relate them with each other for better understanding.

I hope promise in js is clear to you. Now understand the modern version of promise in async/await .

To learn about callbacks visit Callback in javascript