콜백함수(Callback)

  Callback 함수

▶ 콜백함수

인수값으로 던져진 함수가 실행되면서 값이 매개변수로 반환되는 상태

함수의 내부처리과정을 리턴하는 용도로 쓰인다.

 1. 다른 함수의 인자로써 이용되는 함수.

 2. 어떤 이벤트에 의해 호출되어지는 함수.

var sum = function(n1, n2, fn){
	if(typeof fn == 'function'){
    	fn(n1+n2);
    }
}
sum(10, 20, function(n){
	console.log(n);
});

 

addEventListener또한 콜백함수라고 볼 수 있다.

 

▶ 콜백함수 실습

실습1. sum이라는 함수가 있다. 함수를 실행하면서 첫번째 인수는 배열, 두번째 인수는 함수이다. sum함수를 실행시켜 배열의 총 합산값을 2번째 인수의 함수의 매개변수로 받도록 하라.

var arr = [10,20,30,40,50];
var sum = function(arr, fn){
	if(typeof fn == 'function'){
    	var a = 0;
        for(var i=0;i<arr.length;i++){
        	a += arr[i];
        }
        fn(a);
    }
}
sum(arr, function(n){
	console.log(n);
});

실습2. strFn이라는 함수가 있다. strFn 함수가 실행되면서 1번째 인수 문자열, 2번째 인수 함수이다. strFn 함수가 실행시 첫번째 인수 문자열을 '-' 특수기호로 구분하여 배열로 2번째 인수의 함수의 매개변수로 반환하여라.

var strFn = function(str, fn){
	if(typeof fn == 'function'){
    	fn(str.split('-'));
    }
}
strFn('자바스크립트-콜백함수-으어어어어',function(arr){
	console.log(arr);
});