자바스크립트로 콜백(callback) 함수 구현하기

콜백 함수에 대해서 간단하게 설명 해 보겠습니다.

콜백 이란 진짜 쉽게 말해서 호출 했던 부분으로 다시 돌아간다고 생각하시면 됩니다.

아래 소스를 보면서 얘기해보도록 하죠

function doFunction(callback){ // doFunction 에서 실행 될 내용들 var a = 1; var b = 1; var c = a + b; alert('doFunction 에서 실행 될 내용이 실행된다.'); // doFunction 에서 실행 될 내용들이 다 실행 된 후 인자값으로 받은 callback을 실행한다. // 넘겨받은 callback이 함수이기 때문에 실행 가능. // 이때 c 값을 인자값으로 넘겨준다. if(typeof callback === 'function') { callback(c); } }

// 먼저 doFunction을 실행 시키고 callback 함수에 의해 function 안의 내용이 실행된다. doFunction(function(msg){ // doFunction 함수의 호출에 의해서 실행된다. // 인자값으로 받은 c값을 msg 로 받는다. alert('callback 함수의 실행 될 내용'); alert('c 의 값은? ' + msg); });

이렇게 doFunction 함수를 호출해서 doFunction 에서 실행 될 내용들이 다 실행 된 이후

다시 doFunction을 호출했던 부분으로 돌아오는 것 입니다.

이런식으로 특정 함수를 호출 이후 해당 프로세스가 처리 완료 된 시점에 콜백 함수를 이용하여 다른 작업을 할 수 있습니다.

보통 jquery 등으로 ajax 구현 시 xml 결과값을 받아올때도 콜백 함수를 이용하여 처리를 하죠