js -Asynchrononous

Asynchrononous javascript

synchrononous

console.log("First");   //First
console.log("Second");  //Second
console.log("Third");   //Third

task contionue vaa poittea irukkum

Asynchrononous:

console.log("Hello World.!");  // 1st print aagum


 setTimeout(() => {
   console.log("Hello after 2 seconds");   // 2 sec apram third print agum
 }, 2000);


console.log("welcome 'javascript'");  // second print aagum

callback function

Callback illustrated

function One() {
    // Do something    // apram one ulllathu execute agum.
}
function Two(call_One) {
    // Do something else
    call_One()  // one na call pannum
}
Two(One); // two vaa call pannum


//? call back inga aathigam use pannrathu illa.

Promises

3 states: Pending, Fulfilled, Rejected

Pending: Initial state, not yet started
Fulfilled: Successful, resolved with a value
Rejected: Failed, rejected with a reason

      // var name     //obj   // 2 arguments     
const myPromise = new Promise((resolve, reject) => {

                  //false
    const error = true;  // condition

    if (!error) {
        resolve("Yes! resolved the promise");
    } else {
        reject("No! rejected the promise.");
    }
})

console.log(myPromise); 

true output: return states

// Promise <REJECTEDed>: 'NO! reJECT the promise.'

false output: return states

// Promise {<fulfilled>: 'Yes! resolved the promise'
// [[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "Yes! resolved the promise"

            //function
myPromise

.then(value =>{

  //console.log(value);   // 'Yes! resolved the promise'
  return value + " welcome"; // 'Yes! resolved the promise welcome' 

})


//!  another then another then use pannalamm.

.then(newvalue=> {

  console.log(newvalue); // 'Yes! resolved the promise' return panna value ingaa vaarum

})
.catch(error =>{

    console.log(error);  // 'No! rejected the promise.'

});

example:

const myPromise = new Promise((resolve, reject) => {

    const error = false; 

    if (!error) {
        resolve("Yes! resolved the promise");
    } else {
        reject("No! rejected the promise.");
    }
});


const myNextPromise = new Promise((resolve, reject) => {

    setTimeout(function () {

        resolve("my next promise resolved");

    }, 3000)
});


myPromise
  .then((value) => {
    console.log(value); // 'Yes! resolved the promise' return panna value ingaa vaarum
  })


myNextPromise.then(value=> {

  console.log(value); // 'Yes! resolved the promise' return panna value ingaa vaarum

}).catch(error =>{

    console.log(error);  // 'No! rejected the promise.'

});

pending

const users = fetch("http://jsonplaceholder.typicode.com/users").then(response =>{

  //console.log(response);//Response {type: 'cors', url: 'https://jsonplaceholder.typicode.com/users', redirected: true, status: 200, ok: true, …}
  return response.json(); 

}).then(users =>{

    console.log(users);

   // console.log(users[0].name); // 'Leanne Graham'
    //console.log(users[0].email); // '[e-mail]'
    //console.log(users[0].address.street); // 'Kulas Light'

    //users.forEach(user => {  // for each
     //   console.log(users);

  //  });

})

console.log(users); // Promise {<pending>}

//! Async / Await