비동기
= 특정 코드의 실행이 끝날 때까지 기다리지 않고 다음 코드를 실행하는 자바스크립트 엔진의 특성.
= 자바스크립트 코드는 보통 동기적으로(위에서부터 순차적으로) 실행된다.
= 주로 서버에서 데이터를 받아올 때 많이 사용되는데 서버에서 언제 응답을 받을 수 있을지 모르기 때문에 비동기 함수는 실행을 시켜놓고 다음 코드로 넘어가 실행한다.
예시
- API통신을 통해 데이터를 받아올 때
fetch(url)
.then(res => console.log(res))
.then(newRes => console.log(newRes))- setTimeout()과 같은 함수
console.log(1);
setTimeout(()=>{console.log(3)}, 3000);
console.log(2);
// 1, 2, 3순으로 콘솔 찍힘비동기 처리의 문제점
= 함수가 호출되는 순서와 함수가 실제 실행되는 순서가 다르기 때문에 코드의 가독성이 떨어진다.
비동기 처리 문제점 해결방법
-
콜백 함수 이용
-
Promise 이용 (ES6)
-
Async Await 이용 (ES7)
Hello