[JavaScript] 비동기 처리 - async/await

 

 

async / await

Promise를 더욱 쉽게 사용할 수 있도록 해주는 문법이다.

함수 앞 부분에 async 키워드를 추가하고, 해당 함수 내부 Promise 앞부분에는 await 키워드를 사용한다.

async / await는 Promise 객체를 반환하고, 이는 Promise 객체에서 사용하는 then을 대체해서 사용할 수 있는 것이다.

또한 async / awiat를 사용하면 비동기 코드를 마치 동기 코드처럼 보이게 작성할 수 있다.

 

const 함수명 = async() => {
  await 비동기 처리 메서드 명();
}

 

▶ async

    : Promise를 반환하고, Promise가 아닌 것은 Promise로 감싸 반환한다.

    : 함수를 Promise로 return 하는 함수를 만든다.

 

▶ await

    : Promise가 처리될 때까지 기다린다.

    : await는 반드시 async 함수 바로 안에서만 사용해야 한다.

 

 

function increase(number){
  const promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      const result = number + 10;
      if(result > 50){
        const e = new Error("Number is too Big");
        return reject(e);
      }
      resolve(result);
    }, 1000);
  })
  return promise;
}

const runTasks = async() => {
  try{
    let result = await increase(0);
    console.log(result);
    result = await increase(result);
    console.log(result);
    result = await increase(result);
    console.log(result);
    result = await increase(result);
    console.log(result);
    result = await increase(result);
    console.log(result);
    result = await increase(result);
    console.log(result);
  } catch(e){
    console.log(e);
  }
}

runTasks();