코어 자바스크립트 - 04 콜백 함수 WIP

학습목표: 콜백 함수(callback function)이 무엇인지 이해할 수 있다.

콜백 함수란?

콜백 함수는 다른 코드의 인자로 넘겨주는 함수.
콜백 함수를 위임 받은 코드는 자체적인 내부 로직에 의해 이 콜백 함수를 적절한 시점에 실행할 것.

callback은 '되돌아 호출해달라'는 명령.
어떤 함수 X를 호출하면서 '특정 조건일 때 함수 Y를 실행해서 나에게 알려달라'는 요청을 함께 보내는 것.
이 요청을 받은 함수 X의 입장에서는 해당 조건이 갖춰졌는지 여부를 스스로 판단하고 Y를 직접 호출함.

제어권

호출 시점

var count = 0;
var cbFunc = function () {
	console.log(count);
  	if (++count > 4) clearInterval(timer);
};
var timer = setInterval(cbFunc, 300);

/*
이 코드를 실행하면 콘솔창에 0.3초에 한 번씩 숫자가 0부터 1씩 증가하며 출력되며, 4가 출력된 후 종료된다.
setInterval이란 '다른 코드'에 첫 번째 인자로서 cbFunc 함수를 넘겨주자 제어권을 넘겨받은 setInterval이 스스로의 판단에 따라 적절한 시점에 이 익명 함수를 실행한 것.
*/

콜백 함수의 제어권을 넘겨받은 코드는 콜백 함수 호출 시점에 대한 제어권을 가진다.

인자

Array.prototype.map(callback[, thisArg])
callback: function(currentValue, index, array) 
// currentValue, index 순서 바꾸면 의도대로 동작하지 않음

콜백 함수의 제어권을 넘겨받은 코드는 콜백 함수를 호출할 때 인자에 어떤 값들을 어떤 순서로 넘길 것인지에 대한 제어권을 가진다.

this

콜백 함수도 함수이기 때문에 기본적으로 this가 전역객체를 참조하지만, 제어권을 넘겨받을 코드에서 콜백 함수에 별도로 this가 될 대상을 지정한 경우에는 그 대상을 참조하게 된다.

콜백 함수는 함수다

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

var obj = {
	vals: [1,2,3],
  	logValues: function(v, i) {
    console.log(†his, v, i)
    }
};
obj.logvalues(1, 2);  // obj
[4,5,6].forEach(obj.logValues);  // Window {...}

콜백 함수 내부의 this에 다른 값 바인딩하기

콜백 지옥과 비동기 제어

정리