[JavaScript] 고차함수

const onClickNumber = (number) => {
    if(operator) {  // 연산자가 있다면
        numTwo += number;
    } 
    else {          // 연산자가 없다면
        numOne += number;
    }
    $result.value += number;
   // return undefined;
}

document.querySelector('#num-0').addEventListener('click', onClickNumber('0'));

• addEventListener()의 두 번째 매개변수는 함수자리!
  따라서 함수를 넣어줘야 하는데 위 함수는 return undefined 이기 때문에 에러발생
  
  

const onClickNumber = (number) => {
    return () => {
        if(operator) {  // 연산자가 있다면
            numTwo += number;
        } 
        else {          // 연산자가 없다면
            numOne += number;
        }
        $result.value += number;
    }
}

document.querySelector('#num-0').addEventListener('click', onClickNumber('0'));

• return을 앞에 써서 함수자리에 함수를 return 해주었다.
  실행은 정상적으로 되지만 좀 더 개선해보자
  
  

const onClickNumber = (number) => () => {
    if(operator) {  // 연산자가 있다면
        numTwo += number;
    } 
    else {          // 연산자가 없다면
        numOne += number;
    }
    $result.value += number;
}

document.querySelector('#num-0').addEventListener('click', onClickNumber('0'));

• 화살표함수의 경우 위 중괄호와 return이 붙어있다면 return을 생략 가능하다

• 이렇게 나눠서 본다는 느낌이랄까..

따라서 함수 안에 함수가 있다, 함수가 함수를 return 한다.
-> 이를 고차함수(high order function)라고 한다.
고차함수는 주로 함수의 중복을 제거하는데에 사용된다.