심심한잉여의 잡동사니

[JavaScript] async 와 await 본문

코딩일기/자바스크립트

[JavaScript] async 와 await

심심한잉여 2022. 4. 13. 09:36
반응형

async와 await는 자바스크립트의 비동기 처리를 해주던 promise를 보완하기 위해 나온 문법이다.


function fetchItems() {
  return new Promise(function(resolve, reject) {
    var items = [1,2,3];
    resolve(items)
  });
}

async function logItems() {
  var resultItems = await fetchItems();
  console.log(resultItems); // [1,2,3]
}

원래라면 위와 같이 Promise로 리턴하고 따로 resolve를 이용해 사용을 해야했던 반면
async는 자동으로 Promise로 리턴해주기 때문에 그럴 필요가 없다.

그리고 then이나 fetch도 정상적으로 사용이 가능하며 promise와 다르게 try/catch를 사용하는 것에도 문제가 발생되지 않는다. 때문에 여러 then만 사용하고 fetch에 의존했다면 어떤 then에서 문제가 발생한지 모르기 때문에 힘들었던 부분을 보완해준것이다.

또한 async를 붙이면 별도의 promise호출을 필요로 하지 않기 때문에 가독성도 좋아지고
콜백함수로 하지 않고 await을 사용해주면 되기 때문에 사용성과 가독성이 좋아지는 효과를 볼 수 있다.

 

반응형