Asynchronous JavaScript – Callbacks, Promises & async/await

Callbacks – traditional way, leads to “callback hell”.

setTimeout(() => {
  console.log('first');
  setTimeout(() => console.log('second'), 500);
}, 500);

Promises – represent a future value.

fetch('https://api.example.com/data')
  .then(r => r.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

async/await – syntactic sugar over promises.

async function load(){
  try {
    const r = await fetch('/data.json');
    const d = await r.json();
    console.log(d);
  } catch(e){ console.error(e); }
}
load();