JAVASCIPRT Callback에 대해 알아보자

콜백 함수는 다른 코드의 인자로 넘겨주는 함수입니다. 콜백 함수를 넘겨받은 코드는 콜백 함수를 필요에 따라 적절한 시점에 실행합니다. 콜백함수는 이 콜백함수를 실행할 제어권 과 관련이 깊습니다.

콜백 함수는 어떤 함수 X를 호출하면서 특정 조건일 때 실행 되는 함수를 말합니다. 이때 콜백 함수는 값으로 특정 함수 또는 메소드의 인자로 들어갑니다. 이처럼 콜백 함수는 다른 코드에게 인자로 넘겨줌으로써 제어권도 함께 위임한 함수입니다. 콜백 함수를 위임받은 코드는 자체 내부 로직에 의해 콜백 함수를 적절한 시점에 실행 합니다.

콜백 함수도 함수이기에 기본적으로는 this 가 전역 객체를 참조하지만, 제어권을 넘겨받은 코드에서 콜백 함수에 별도로 this가 될 대상을 지정한 경우에는(call, apply, bind 등 사용시) 그 대상을 참조합니다. 또한 콜백함수가 arrow function으로 정의된 경우에는 렉시컬 스코프상 가장 가까운 this를 참조하게 됩니다.

콜백 함수로 어떤 객체의 메서드를 전달하더라도, 그 메서드는 메서드가 아닌 함수로써 호출이 됩니다.

const obj = {
  vals: [1, 2, 3],
  logValues: function(v, i) {
    console.log(this, v, i)
  },
}

obj
  .logValues(1, 2) // { vals: [...], logValues: f..} 1 2
  [(4, 5, 6)].forEach(obj.logValues) // window { ... } 4 0, window { ... } 5 1, window { ... } 6 2

어떤 함수의 인자에 객체의 메서드를 전달하더라도 본질적으로는 함수를 값으로 전달하는 것을 이해해야 합니다.

콜백 함수의 꽃은, 이미 만들어진 Javascript의 함수, 메서드들 뿐 아니라 eventListener, 그리고 끝판왕인 비동기 처리가 있습니다.

비동기 처리의 경우 포스팅 할 컨텐츠가 많기 때문에 이는 다음에 기록하도록 하겠습니다.