Callback

호이스팅

• var, function 선언들이 가장 최상위로 올라가는 것이 호이스팅

동기적

• 호이스팅 이후 코드가 나타나는 순서대로 실행
• Javascript는 synchronous 프로그래밍 언어이다

비동기

console.log(1);
setTimeout(function() {
console.log(2)}, 1000
)
console.log(3);

위와 같은 코드일 때, setTimeout 함수는 브라우저 API로서 콜백함수 인자와 시간을 받아 해당 시간이 지난 후에 콜백 함수를 실행한다.

이때, 해당 시간이 지난 후에 콜백을 실행하라는 명령을 브라우저에게 던지는 작업은 즉각 일어나며, 던진 후에는 바로 console.log(3)이 실행된다

그리고 시간이 흐른 후 console.log(2)가 실행된다

이것이 비동기 동작이다.

즉, 순서대로 발생하지 않고 어떤 작업이 백그라운드에서 실행되고 있고 (setTimeout) 그 사이 다른 작업이 실행되는, 순차적이지 않은 작업을 비동기적 작업이라고 한다

Callback 함수란?

어떤 함수의 인자로 전달되는 함수를 Callback 함수라고 부른다

1. Synchronous 콜백

   function runImmediately(print) {
     print();
   }
   
   runImmediately(() => console.log('hello'));

   위의 코드에서 console.log는 즉각 실행된다. 즉 runImmediately 함수의 인자로 전달된 익명함수 () ⇒ console.log(’hello’) 콜백함수는 즉각 실행된다. 동기적 실행

2. Asynchronous 콜백

   function runDelay (print, timeout) {
     setTimeout(print, timeout);
   }
   
   runDelay(() => console.log('hello'), 1000);

   같은 형식의 함수이지만, () => console.log('hello') 함수는 1000ms 시간이 지난 후에 실행된다. 비동기 실행

함수의 인자로 전달된 콜백함수는 동기적, 비동기적 실행 모두 가능하다