serpiko 2013. 10. 16. 01:50

   콜백함수의 기본사용


/******************************************
* main
******************************************/

$("#btn").click(function(){
  ageQuestion(myAge);
  });

function myAge(){
 console.log("My age : 22")
}

/******************************************
* callback
******************************************/
function ageQuestion(callback){
 if( typeof callback == "function" ){
  callback();
 }
}


6 : ID가 btn인 객체를 클릭하면 ageQuestion 함수를 실행하되 매개변수로 myAge함수를 넘긴다.


16 : ageQuestion 함수에서 callback으로 받아서 유효성을 검사 한 뒤, 실행시킨다.


9 : 결과적으로 myAge가 실행되어 "My age : 22" 가 출력된다.

 



   콜백함수의 응용


/******************************************
* main
******************************************/

$("#btn").click(function(){
  ageQuestion(myAge);
  });

function myAge($age){
 console.log("My age : " + $age)
}

/******************************************
* callback
******************************************/
function ageQuestion(callback){
 var age = ageThink();
 if( typeof callback == "function" )callback(age);
}

function ageThink(){
 return "23";
}

조금 더 실용성 있게 응용해서 만들어 본 것.

 

6 : ID가 btn인 객체를 클릭하면 ageQuestion 함수를 실행하되 매개변수로 myAge함수를 넘긴다.


16 : ageQuestion 함수에서 var age 라는 변수에 ageThink() 함수를 호출하고 반환받은 "23"을 저장한다.


18 : 유효성을 검사 한 뒤, callback의 매개변수에 age값을 전달하여 실행한다.


9 : myAge에서 받은 값을 출력한다. "My age : 23"