고차함수 (Higher Order function)
- 함수를 인자로 받는 함수
- 함수를 리턴하는 함수
콜백함수 (Callback function)
- 함수안의 함수
- 다른함수의 인자로 전달되는 함수
예를들면
// callBack용으로 전달할 함수를 변수에 할당한다.
const callbackFunc = () => {
return console.log("some shit things..");
}
// 함수를 인자로 전달받는 고차함수를 할당한다.
const HOFOutPut = function(callbackFunc, anyNumber) {
callbackFunc();
console.log("입력받은 두번째 인자값: ", anyNumber)
return function(onePluse) {
const result = onePluse+1;
console.log(result)
return result;
}
}
// (위와 같은 내용이지만 화살표 함수 형식으로 할당하기)
const HOFOutPut = (callbackFunc, anyNumber) => {
callbackFunc();
console.log("입력받은 두번째 인자값: ", anyNumber)
return function(onePluse) {
const result = onePluse+1;
console.log(result)
return result;
}
}
사용법 1
- 이부분에서 callbackFunc를 콜백함수라 칭한다.
const result = HOFOutPut(callbackFunc, 2);
// some shit things... 출력됨
// 입력받은 두번째 인자값: 2 출력됨
result(5) // 6 출력됨
사용법 2
HOFOutPut(callbackFunc, 2)(5);
// some shit things... 출력됨
// 입력받은 두번째 인자값: 2 출력됨
// 6 출력됨
고차함수에서 return 전, 지정된 코드가 실행된다음 return 에서 고차함수 본연의 작업이 진행됨
응용 - 3단 currying에서 고차함수와 콜백함수를 사용해보기
const callBackFunction2 = (data) =>{
console.log("activate!: ", data);
}
function middleware(store){
console.log("store: ", store);
return function(next){
console.log("next: ", next);
return function(action, callback){
console.log("action: ", action);
callback(action);
return;
}
}
}
// 위 내용을 화살표 함수로 표현하기
const middleware = (store) => (next) => (action, callback) =>{
console.log("store: ", store);
console.log("next: ", next);
console.log("action: ", action);
callback(action);
}
middleware("스토어")("넥스트")("액션", callBackFunction2);
// store: 스토어
// next: 넥스트
// action: 액션
// activate!: 액션