JavaScript | 비동기 callback 함수

자바스크립트는 동기적인 언어 synchronous
호이스팅이 된 이후부터 하나하나 순서대로 실행한다.

호이스팅 > var, function 선언이 자동적으로 제일 위로 올라가는 것
호이스팅이 된 이후 코드가 나타나는 순서대로 하나 하나 실행됨

asynchronous > 언제 코드가 실행될 지 예측할 수 없는 것

setTimeout() //웹 브라우저 API로 지정한 시간이 지나면 콜백 함수 호출
setTimeout(function() {
	console.log('2');
}, 1000) //1초 뒤 console.log를 하라는 뜻

console.log('1');
setTimeout(() => console.log('2');, 1000)
console.log('3');

//콘솔 창에는 1,3,2가 뜨게 됨

비동기를 쓸 때는 콜백을 만들어서 사용이 가능하지만 콜백함수를 쓰게되면 콜백 함수 안에 또 다른 콜백, 그 안에 또 다른 콜백 함수를 부르게 되어 콜백 지옥이 될 수 있다. 이는 가독성이 매우 떨어질 뿐 아니라 유지보수도 어렵다.

Promise, async/await를 사용해 비동기 코드를 깔끔하게 작성할 수 있고 효율적으로 네트워크 통신을 할 수 있다.