JS-콜백 함수

function repeat(n){
	for(var i = 0;i<n;i++)console.log(i);
}

repeat(5);
// 0 1 2 3 4

다음의 repeat함수는 매개변수를 통해 전달받은 N만큼 console.log(i)를 호출한다.

이때, repaet함수는 console.log(i)에 강하게 의존하고 있어서 다른 일을 할 수 없다.

따라서 repeat함수의 반복문 안에서 다른 일을 하고 싶다면 또 다른 함수를 새로 정의해야 한다.

 

function repeat1(n){
	for(var i = 0;i<n;i++)console.log(i);
}

repeat1(5);
//0 1 2 3 4

function repeat2(n){
	for(var i = 0;i<n;i++){
    	if(i%2 != 0){
        	console.log(i);
            }
       }
}

repeat2(5);
//1 3

위의 함수들은 반복하는 일은 변하지 않고 공통적으로 수행하지만 반복하면서 하는 일의 내용

(모두 출력/ 홀수만 출력)은 다르다.

즉 ,함수의 일부분이 다르기 떄문에, 매번 함수를 새로 정의해야 한다.

이 문제는 함수를 합성하는 것으로 해결 할 수 있다. 함수의 변하지 않는 부분

공통적인 로직은 미리 정해두고, 경우에 따라 변하는 로직은 추상화해서 함수 외부 -> 함수 내부로 전달한다

 

//외부에서 전달받은 f를 n만큼 반복한다

function repeat(n,f){
	for(var i = 0;i<n;i++){
    	f(i); //i를 전달하면서 f 호출
        }
 }
 
 //함수 표현식 (익명함수)
 var logAll = function (i){
 	console.log(i);
 };
 
 repeat(5,logAll); //0 1 2 3 4
 
 var logodds = function (i){
 	if(i%2 == 0)console.log(i);
};

//반복 호출할 함수를 인수 f에 전달한다
repeat(5,logodds);
//0 2 4

위의 repeat함수는 경우에 따라 변경되는 일을 함수 f로 추상화하였고, 외부에서 f에 전달한다.

 

repeat함수는 더 이상 내부 로직에 의해 강력한 규약을 받지 않고, 

외부에서 로직의 일부분을 함수로 전달받아 수행한다.

 

repeat함수는 전보다 더 유연한 구조를 갖게 된다.

위에서의 fullnamelog는 lastname,firstname,callback인자를 3개 받는다.

fullname은 lastname과 firstname을 합한 값을 가리키는 식별자이고,

fullname을 매개변수로 해서 callback함수를 실행한다.

 

lastname = '강', firstname = '호동' ,callback이 name을 인자로 갖는 익명함수일떄,

fullname은 '강'과 '호동'을 합친 '강호동'이라는 문자열을 가리키는 식별자이고,

익명함수에 name 매개변수는 fullname으로 할당되고 console.log(name)을 하면

'강호동'이 출력된다.

 

함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백 함수라고 하며,

매개변수를 통해 함수 외부에서 콜백 함수를 전달받은 함수를 고차 함수라고 한다.

---

고차 함수와 콜백함수에 대해서 더 자세히 정리하자면 다음과 같다.

 

고차 함수 (Higher-Order-Function HOF)

 

아래 조건 중 적어도 하나를 만족하면 고차함수라고 할 수 있다.

 

-하나 이상의 함수를 인자로 받는다.

-함수를 결과로 반환한다.

 

 

twice()는 외부에서 f(함수)를 인자로 전달받아서, f(함수)를 2번 반복해주는 고차함수이다.

twice(plus,1)을 호출하면 f에 plus함수가 v에 1이 전달되고, f(plus(1))을 리턴하는데

plus(1)은 2이고 f(2), plus(2)는 3이므로 3이 출력된다.