JavaScript 비동기 처리와 콜백 함수

1. 비동기 처리란?

자바스크립트의 비동기 처리란 특정 코드의 연산이 끝날때까지 기다려주지 않고 다음 코드가 먼저 실행되는 자바스크립트의 특성을 의미한다.

2. 비동기 처리의 사례

setTimeout()메서드는 비동기 처리의 대표적인 사례이다. setTimeout()메서드는 코드를 바로 실행하지않고, 지정한 시간만큼 기다린 이후 로직을 실행한다.

// #1
console.log("one");
// #2
setTimeout(function() {
	console.log("two");
}, 3000);
// #3
console.log("three");

비동기 처리방식이 아니라면 아마 결과는 다음과 같이 나올 것이다
1. "one" 출력
2. 3초 후, "two" 출력
3. "three" 출력

하지만 실제 결과 값은 아래와 같이 출력된다.
1. "one" 출력
2. "three" 출력
3. 3초 후, "two" 출력

setTimeout()메서드가 실행되고 3초를 기다릴동안, 그 다음 코드는 기다려 주지않고 실행되기 때문에 즉, 비동기로 처리되기 때문에 위와 같은 결과가 나타난다.

3. 콜백 함수로 비동기 처리 방식 문제점 해결하기

콜백함수는 특정 로직이 끝났을때 원하는 동작을 실행시키는 함수라고 이해하면된다.

즉, called at the back 을 의미한다.

콜백함수를 통해 특정함수가 처리가 된이후에 처리시킬 함수를 콜백함수화 시키면 비동기처리의 문제점을 해결 할 수 있다.