Async / Await

이후경·2022년 9월 1일
0

Async / Await

Async

  • Promise를 대체할 수 있다.
  • async / await 키워드를 통해 쉽게 promise객체를 생성하고 then, catch를 대신해서 사용할 수 있다.
  • async를 function앞에 붙이면 함수가 promise역할을 하게된다.

Await

  • then 대신에 사용할 수 있는 Await
  • 단순한 의미는 기다려 달라는 뜻인데 비동기적으로 처리를 할때 promise를 기다려 달라는 의미
  • 단 await는 async안에서만 사용할 수 있는 키워드
  • await는 promise가 실패할 경우 에러가 발생하고 멈춘다.
  • 이를 방지하고자 try{} catch{}구문을 사용한다.

try{} catch{}

async function cal() {
  let test = new Promise((resolve, reject) => {
    let sum = 1 + 1;
    resolve(sum);
  });

  try { //try 를 먼저 실행해보고 실행되면 try 문 그대로 출력
    let result = await test;
    console.log(result)
  } catch { // try 가 실패시, catch 문 출력
    console.log('fail')
  }
}

cal();

순차적으로 많은것을 실행할때 유용하다.

async function getDataOne() {
    const result = await fetchData() // 데이터를 가져오는데 3초의 시간이 걸린다면 이를 기다려줌
    return result
}

async function getDataTwo() {
    const result = await fetchData() // 데이터를 가져오는데 3초의 시간이 걸린다면 이를 기다려줌
    return result
}

function getAllData() {
    return Promise.all([getDataOne(), getBanana()])
    .then(data => 
        console.log(data) // 데이터를 병렬로 가져오기 때문에 3초의 시간 소요
    )
}

getAllData().then(console.log)
profile
나는야 경바

0개의 댓글