MODERN PROMISES WITH ASYNC/AWAIT

Overview - designed to allow JS devs to write true synchronous code


// USING .THEN
// - not very clean

function walkTheDog() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("happy dog");
    }, 1000);
  });
}

function doChores() {
  console.log("before walking the dog");
    walkTheDog()
        .then((res) => {
            console.log(res);
            console.log("after walking the dog");
    });
}

doChores();

Function Declaration with async - creates a function that returns an implicit promise containing the result - allows us to utilize await keyword inside

Awaiting Promises with await - used to wait for promise to be fulfilled or rejected - rest of code in async func waits until promise is fulfilled to execute - can only use inside an async function


// USING ASYNC/AWAIT


function walkTheDog() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("happy dog");
    }, 1000);
  });
}

async function doChores() {
    console.log("before walking the dog");
    const res = await walkTheDog();
    console.log(res);
    console.log("after walking the dog");
    return res.toUpperCase();
}


// async funcs return a promise
// return value is value promise fulfills with
// passed along to following .thens
doChores()
    .then(res => console.log(res))

Error Handling - async/await results in synchronous execution - can use normal try...catch block to handle errors if promise rejected


function action() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      reject('uh-oh'); // rejected
    }, 3000);
  });
}

async function handlePromise() {
  try {
    const res = await action();
    console.log('resolved with', res);
  } catch (err) {
    console.log('rejected because of', err);
  }
}

handlePromise();