14.2 콜백

콜백함수의 특징

• 자바스크립트에서 가장 오래된 비동기적 메커니즘

• 간단히 말해 나중에 호출할 함수 = 콜백

• 일반적으로 다른 함수에 넘기거나 객체의 프로퍼티로 사용

• 보통 익명 함수로 사용함

초보자가 실수하는 경우

  console.log("Before timeout: " + new Date());

  function f() {
    console.log("After timeout: " + new Date());
  }

  setTimeout(f, 60 * 1000);

  console.log("I happen after setTimeout");
  console.log("Me too");

Before timeout: Tue Nov 13 2018 16:18:43 GMT+0900 (한국 표준시)
I happen after setTimeout
Me too

• 위의 코드를 실행하면 기대와 다른 결과를 볼 수 있음

• Why? 컴퓨터는 작성한 코드를 정확히 순서대로 처리하지 않음

• 자바스크립트는 싱글 스레드를 사용하기때문에 위의 코드를 실행하라고 하면 프로그램이 멈추고, 사용자 입력 X, 화면 업데이트 등이 이루어지지 않을 것임

• 이름 붙은 함수를 써야하는 타당한 이유가 없다면 익명 함수를 써야함

익명함수를 사용한 콜백 예제

  console.log("Before timeout: " + new Date());

  setTimeout(function() {
    console.log("After timeout: " + new Date());
  }, 60 * 1000);

  console.log("I happen after setTimeout");
  console.log("Me too");

Before timeout: Tue Nov 13 2018 16:22:13 GMT+0900 (한국 표준시)
After timeout: Tue Nov 13 2018 16:23:13 GMT+0900 (한국 표준시)
I happen after setTimeout
Me too