async function

Estimated reading time: 3 minutes

async is short form of asynchronous. async behavior is opposite of sync. Promise more comfort with async.

synchronous vs asynchronous

synchronous

  • execute step by step in sequence.
  • each statement wait for previous statement executing.
console.log('one para');
console.log('two para');
console.log('three para');
// output:
// one para
// two para
// three para

asynchronous

  • don’t excute in sequence.
  • don’t wait for excute
setTimeout(() => {
  console.log('one');
},3000)
console.log('two');
console.log('three');
// if gradually , output : one, two, three
// but asynchronous output : two,three ,one
// don't wait for one excute

async function

let users = async () => {
  return 1;
}
users().then(t => console.log(t));

await

  • await wait until promise settle.
  • await use only inside async function;
let users = async()=> {
  let promise = new Promise((resolve,reject)=> {
    let name = 'kamal';
    setTimeout(()=> {
      resolve(name);
    },5000);
  });
  let userName = await promise;
  console.log(userName);
}
users();

users = async() => {
  let git = await fetch('https://api.github.com/users/mostafa6765');
  let gitUser = await git.json();
  return gitUser;
}
users().then(t => console.log(t));

error

  • try…catch
  • then…catch (promise)

try -> catch

users = async() => {
  try{
    let git = await fetch('https://no-url');
    let gitUser = await git.json();
    return gitUser;
  }catch(e){
    alert(e)
  }
}
users().then(t => console.log(t));

then -> catch

users = async() => {
  let git = await fetch('https://no-url');
  let gitUser = await git.json();
  return gitUser;
}
users().then(t => console.log(t)).catch(t=> console.log(t));

resource

js