JavaScript에서 async와 await을 이용한 비동기 처리

반응형

🔥 자바스크립트의 비동기 처리 방법 중 하나인 async와 await에 대해 알아보겠습니다. 초보자도 쉽게 이해할 수 있도록 차근차근 설명해 드리겠습니다.

🤔 async와 await 이란?

async와 await은 자바스크립트에서 비동기 처리 패턴을 간략화하는 방법입니다. 이 둘을 이용하면 비동기 코드를 마치 동기 코드처럼 보이게 작성할 수 있습니다. 이로써 코드의 가독성이 향상되고, 로직을 이해하기 쉬워집니다.

😎 async와 await 사용 예시

// async를 이용한 함수 선언
async function fetchData() {

  // await를 이용하여 프로미스가 settle될 때까지 기다립니다.
  // 프로미스가 reject될 경우 예외가 발생합니다.
  const response = await fetch('http://example.com/movies.json');

  // 응답을 처리합니다.
  const data = await response.json();

  // 가져온 데이터를 반환합니다.
  return data;
}

// 함수를 호출합니다.
fetchData().then(data => console.log(data));

위 코드에서 async 함수는 항상 프로미스를 반환하고, await 키워드는 async 함수 내에서만 사용할 수 있습니다. await 키워드 뒤에 있는 프로미스가 완료될 때까지 함수의 실행을 일시 중단시킵니다.

---

📚 async와 await을 이용하면 비동기 코드를 간편하게 작성할 수 있습니다. 특히 코드의 가독성이 향상되어 로직을 이해하기 쉬워집니다.

📌 다음 글 예고: JavaScript에서 Promise를 이용한 비동기 처리

다음에는 자바스크립트에서 Promise를 이용한 비동기 처리 방법에 대해 알아보겠습니다. 함께 배워나가요! 🚀

728x90