[javascript정리] 비동기 처리

Kyungoh Kang·2021년 2월 6일
0

javascript 정리

목록 보기
6/7

비동기

= 특정 코드의 실행이 끝날 때까지 기다리지 않고 다음 코드를 실행하는 자바스크립트 엔진의 특성.
= 자바스크립트 코드는 보통 동기적으로(위에서부터 순차적으로) 실행된다.
= 주로 서버에서 데이터를 받아올 때 많이 사용되는데 서버에서 언제 응답을 받을 수 있을지 모르기 때문에 비동기 함수는 실행을 시켜놓고 다음 코드로 넘어가 실행한다.

예시

  1. API통신을 통해 데이터를 받아올 때
fetch(url)
.then(res => console.log(res))
.then(newRes => console.log(newRes))
  1. setTimeout()과 같은 함수
console.log(1);

setTimeout(()=>{console.log(3)}, 3000);

console.log(2);

// 1, 2, 3순으로 콘솔 찍힘

비동기 처리의 문제점

= 함수가 호출되는 순서와 함수가 실제 실행되는 순서가 다르기 때문에 코드의 가독성이 떨어진다.

비동기 처리 문제점 해결방법

  1. 콜백 함수 이용

  2. Promise 이용 (ES6)

  3. Async Await 이용 (ES7)

0개의 댓글