async / await

3. async/ await

비동기 처리 패턴중 가장 최근 문법 ES8 문법.

일반적으로 await의 대상이 되는 비동기 처리 코드는 프로미스를 반환하는 API 호출함수다.

function fetchItems() {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      var items = [Min, Ha, Hye];
      resolve(items);
    }, 2000);
  });
}

async function logItems() {
  var resultItems = await fetchItems();
  console.log(resultItems);
}

logItems(); // (2초후에) [Min, Ha, Hye]

위 예시 코드를 보면 async와 await 문법을 좀더 명확하게 이해할수있다.

async function logTodoTitle() {
  var user = await fetchUser();
  if (user,id === 1) {
    var todo = await fetchTodo();
    console.log(todo.tile);
  }
}

async await 문법을 사용하면 기존의 비동기 처리 방식을 복잡하게 생각하지 않아도 된다는 부분이 장점이다.

🔧 async await 예외처리

async function logTodoTitle() {
  try {
    var user = await fetchUser();
    if (user.id === 1) {
      var todo = await fetchTodo();
      console.log(todo.title); // delectus aut autem
    }
  } catch (error) {
    console.log(error);
  }
}

네트워크 통신 오류나 간단한 타입오류등의 간단한 오류들도 try catch문을 사용해서 잡아낼 수 있다.