Javascript 고차 함수문제(1) - pipe

Javascript  고차함수 중 pipe 문제 유형에 대해 공부해보겠습니다. 

문제와 입력, 출력, 주의사항은 다음과 같습니다.

Javascript 고차함수 링크 : MDN 자료


문제 :

함수들을 입력받아 함수들이 입력된 차례대로 결합된 새로운 함수를 리턴해야 합니다.

입력:
입력인자 1 : func1 >>> number 타입을 입력받아 number 타입을 리턴하는 함수

입력인자 2 : func2 >>> number 타입을 입력받아 number 타입을 리턴하는 함수

입력인자 N : funcn >>> number 타입을 입력받아 number 타입을 리턴하는 함수


출력: 

함수를 리턴해야 합니다.

리턴되는 함수는 정수를 입력받아 func1, func2, ..., funcN의 순으로 적용합니다.

주의사항:
입력되는 함수들의 수는 1개 이상이라고 가정합니다.

함수가 아닌 입력은 존재하지 않는다고 가정합니다.
입력받은 함수들이 어떤 일을 하는지는 중요하지 않습니다.

입출력 예시

function square(num) {
  return num * num;
}

function add5(num) {
  return num + 5;
}

function mul3(num) {
  return num * 3;
}

function isOdd(num) {
  return num % 2 !== 0;
}

let output = pipe(add5, square);
console.log(output(4)); // --> 81

output = pipe(square, add5, mul3);
console.log(output(4)); // --> 63

output = pipe(square, mul3, add5, add5, isOdd);

위에 글을 읽고 입출력 예시를 보면 데이터 흐름을 분석해볼 수 있습니다. 

첫번째 console.log에서는 4를 입력으로 넣었는데 81이 나옵니다. 
이럴 경우 어떻게 적용된 것일까요??

먼저 add5(4)가 적용된 뒤 리턴값으로 9가 나오면
이 9를 square 함수에 적용해서 square(9)로 출력하면 81이 나옵니다.
이런 단계로 실행된다고 볼 수 있습니다.
output(square(add5(4))) 




풀이코드

function pipe(...funcs) {  
    return (num) => {
      res = funcs.reduce((acc, cur) => {return cur(acc)}, num)
      return res
    }
  }

 

 

풀이에서 쓰인 개념

• 자바스크립트 함수의 인자(arguments) ->> (javascript arguments object)
  • 위의 함수 입출력 예시와 풀이코드에서 함수이름, 매개변수, 인수는 어떤 것일까요?
  • 매개변수는 ...funcs 같이 함수를 선언할 때의 변수입니다.
  • 인수는 함수를 호출할 때의 값 즉 pipe(add5, square)에서 add5와 square라고 할 수 있습니다.
  • 링크
•  Rest 파라미터 ->> (rest parameters, )
  • 링크
• reduce 
  • 링크