Javascript(callback function과 higher order function)

HIGHER-ORDER FUNCTIONS

인간이 사용하는 어휘들은 대체로 일련의 과정들을 추상화 한 것이다. 예를 들어 ‘제빵’이라는 단어 자체는 오븐을 예열하고 , 반죽을 준비해서 그 안에 넣고 등등의 과정들이 함축된 것이다. 이러한 추상화(abstraction)을 구현 하는 것을 배울 것이고 Higher order functions에 대해서 배울 것이다. Higher order function는 간단히 말하면 argument로 다른 함수를 받는 것을 말한다 .

자바스크립트에서 함수는 first class object 로 분류된다. 이 말은 function도 오브젝트의 일종이기 때문에, .length .name 등의 속성을 가지고 .toString() 등의 메소드도 가진다.

함수의 원 이름을 확인하는 것은 위와 같은 이유로 다음처럼 작성할 수 있다.

const Thisistoolongtouse= () => {
  for(let i = 1; i <= 1000000; i++) {
    if ( (2 + 2) != 4) {
      console.log('Something has gone very not good:( ');
    }
  }
};

// Write your code below

const isTwoTwo = Thisistoolongtouse;

isTwoTwo();
console.log(isTwoTwo.name) // 결과로 Thisistoolongtouse를 표시한다. 괄호를 쓰지 않음. 

Functions As Data

아래의 방법으로 길고 읽기 불편한 함수들을 짧은 변수로 치환할 수 있다. 두 변수가 모두 같은 곳을 참조하고 있음으로서 가능해진다. 우리는 함수가 반환하는 값을 busy에 대입하고 싶은 것이 아니라, 그것이 가리키는 함수 그 자체를 대입하고 싶기 때문에 괄호를 쓰지 않는다.

const thisIsTooLongToUse= () => {
    console.log("I’m doing very important job!");
};

const busy = thisIsTooLongToUse;
 
busy(); // This function call barely takes any space!

Functions as Parameters

다른 함수에 parameter로 전달되는 함수를 콜백함수(callback function)이라고 부른다.

콜백함수는 higher-order function의 실행 도중에 따라서 실행된다.

아래는 예시 .

const higherOrderFunc = param => {
  param();
  return `I just invoked ${param.name} as a callback function!`
}
 
const anotherFunc = () => {
  return 'I\\'m being invoked by the higher-order function!';
}
 
higherOrderFunc(anotherFunc);

const addTwo = num => {
  return num + 2;
}

const checkConsistentOutput = (func, val) => {
 const checkA = val+2;
 const checkB = func(val);

 if(checkA===checkB){
   return checkB
 } else {
   return 'inconsistent results'
 }
}

console.log(checkConsistentOutput(addTwo,3));

이 부분 특히 call back function에 대한 많은 질문글들이 있길래 레퍼런스 되는 링크들을 모아봤다.

링크 모음

Higher Order Functions

Higher Order Functions in JavaScript