[Syntax] Async & await

Async & Await

Promise 와 Callback 와 마찬가지로 자바스크립트 비동기 처리에 사용되는 객체이다.

Async & Await VS Promise

getDatas() 는 Promise 객체이다.

• Promise

    const datas= () => {
        getDatas()
            .then(datas => {
                console.log(users);
                return datas;
            })
            .catch(error => {
                console.log(error);
            });
    }

• Async & Await

    const datas = async() => {
        console.log(await getDatas());
        return await getDatas();
    }

둘의 차이점은 명확하다.

• 코드의 간결함이 남다르다.
• 자바와 같이 동기적 코드 흐름으로 개발이 가능하다.
• 가독성이 높아진다.
• try / catch로 에러를 핸들링할 수 있다.
• error가 어디서 발생했는지 알기 쉽다.

예외 처리 방법

async () => {
  try {
    let user = await fetchUser();
    if (user.id === 1) {
      let todo = await fetchTodo();
      console.log(todo.title);
    }
  } catch (error) {
    console.log(error);
  }
}

주의할 점

비동기 처리 메서드가 꼭 Promise 객체를 반환해야 한다. 그렇게 해야 await가 의도한 대로 동작한다.