[Javascript]CallBack 함수

*CallBack 함수? 

어떤 이벤트가 발생되거나 특정 지점에 도달했을 때 실행되는 함수.

이렇게 들으면 감이 잘 안 오는데...

쉽게 예시를 들자면 ① 특정 함수를 실행한다. ② 함수가 다 실행됐어! ③ 그러면 다음 함수로 연결하자~ 임

즉 어떠한 함수나 이벤트가 끝나거나 지정된 특정 시점에서 다음 함수로 연결된다.

이는 비동기 방식(가장 대표적으로 ajax)에서 유용하게 사용되는데 

ajax 비동기 방식으로 값을 받는 동안 다른 이벤트를 처리하고 값을 다 받은 시점에 이벤트를 처리(예를 들면 화면에 출력해주기) 등을 할 수 있음.

이는 다음 시간에 자세히 다뤄봐야징

 

아래는 CallBack 함수 예시다.

$(document).ready(function () {
        fnAdd(10, 5, callAlert);   //1
        fnAdd(10, 3, callConsole); //4
    });
 
function callAlert(result){    //3
    alert("do fnAdd() " + result);  
}
 
function callConsole(result){   //6
    console.log("do fnAdd() " + result);
}
 
 
function fnAdd(a,b,callback){ 	//2    //5
    var result = a + b;
 
    callback(result);	//callback 함수 호출 및 값 넘김(callAlert, callConsole)
}

1.    fnAdd(fnAdd(인자 1, 인자 2, 함수 실행 후 callback할 함수)함수 실행문 만들기

2.    fnAdd함수 실행

3.    callback문을 이용해서 fnAdd함수 실행 후 callback할 함수로 return(return문인데 함수로 보내준다고 생각해보자)

4.    연결된 callback함수(callAlert, callConsole)에서 fnAdd함수에서 넘어온 값으로 실행문 ㄱㄱ

 

결과 

callAlert

 

callConsole

 

 

 

 

 

반응형