고차함수 (higher order function)

hyemini·2022년 8월 10일
0

2022. 08.10 - TIL 💁‍♀️


오늘 배운 내용 ✍

  • 일급 객체의 특징
  • 고차 함수(higher order function)란?
  • 고차 함수를 자바스크립트로 작성하기

복습 & 정리 📖

일급 객체의 특징

일급 객체란?
일반 객체처럼 모든 연산이 가능한 것을 일급 객체라 한다!

  1. 함수의 매개변수로 전달할 수 있다
  2. 함수의 반환값으로 반환할 수 있다
  3. 할당 명령문을 사용할 수 있다
  4. 동일 비교 대상이 가능하다

이러한 연산들이 가능한 것을 일급 객체라 한다 🌝
그중에서 대표적인 것 중 하나는..? 바로 함수이다!
자바스크립트에서 함수는 저렇게 모~든 연산이 가능하다는 것이다 🤭


고차 함수(higher order function)란?

함수에서 다른 함수를 인자로 받거나 (콜백함수)
함수를 반환하는 함수를 고차함수라고 한다!

  1. 다른 함수를 인자로 받는 경우
function double(num) {
  return num * 2;
}

function doubleNum(func, num) {
  return func(num);
}

/*
 * 함수 doubleNum은 다른 함수를 인자로 받는 고차 함수입니다.
 * 함수 doubleNum의 첫 번째 인자 func에 함수가 들어올 경우
 * 함수 func는 함수 doubleNum의 콜백 함수입니다.
 * 아래와 같은 경우, 함수 double은 함수 doubleNum의 콜백 함수입니다.
 */
  1. 함수를 리턴하는 경우
function adder(added) {
  return function (num) {
    return num + added;
  };
}

/*
 * 함수 adder는 다른 함수를 리턴하는 고차 함수입니다.
 * adder는 인자 한 개를 입력받아서 함수(익명 함수)를 리턴합니다.
 * 리턴되는 익명 함수는 인자 한 개를 받아서 added와 더한 값을 리턴합니다.
 */
  1. 함수를 인자로 받고, 함수를 리턴하는 경우
function double(num) {
  return num * 2;
}

function doubleAdder(added, func) {
  const doubled = func(added);
  return function (num) {
    return num + doubled;
  };
}

/*
 * 함수 doubleAdder는 고차 함수입니다.
 * 함수 doubleAdder의 인자 func는 함수 doubleAdder의 콜백 함수입니다.
 * 함수 double은 함수 doubleAdder의 콜백으로 전달되었습니다.
 */

고차 함수를 자바스크립트로 작성하기

returnFunction

'Hello HoF!' 리턴하는 함수를 리턴해야 합니다.

function returnFunction() {
  return () => {
    return 'Hello HoF!'
  }
}

저는 이렇게 해보았습니다 console.log(returnFunction()()); 이렇게 하면 콘솔창에 Hello HoF! 가 뜹니다


pipe

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

function pipe(...funcs) {
  return function (num){
    let result = num
    for (let i = 0; i < funcs.length; i++) {
      result = funcs[i](result)
    }
    return result
  }
}

여기서부터 좀..어렵게 느껴졌다..^-^


callbackOnly

함수와 객체를 입력받아 조건별로 아래와 같은 동작을 수행해야 합니다.

객체의 'status' 속성값이 'fail'인 경우, 'Something went wrong!'을 리턴해야 합니다.
객체의 'status' 속성값이 'success'인 경우, 'data' 속성값에 입력받은 함수를 적용한 결과를 리턴해야 합니다.
function callbackOnly(callback, response) {
  if(response.status == 'fail'){
    return 'Something went wrong!'
  } else if (response.status == 'success'){
    return callback(response.data)
  }
}

~인 경우를 보고 조건문을 써서 해결했다!


mapCallback

함수와 배열을 입력받아 배열의 각 요소에 함수가 적용된 새로운 배열을 리턴해야 합니다.

function mapCallback(func, arr) {
  let newArr = []
  for (let i =0; i < arr.length; i++) {
    newArr.push(func(arr[i]))
  }
  return newArr
}

filterCallback

함수와 배열을 입력받아 배열의 각 요소에 함수를 적용했을 때 그 결과가 참인 요소만을 갖는 새로운 배열을 리턴해야 합니다.

function filterCallback(func, arr) {
  let newArr = []
  for (let i =0; i < arr.length; i++) {
    if (func(arr[i])) {
      newArr.push(arr[i])
    }
  }
  return newArr
}

슬슬 머리가 아파온다..^^


GOOD 😉

아직 1~9번까지밖에 안 풀었지만 코플릿 재밌었다! (어렵쥐맨..)

BAD 😥

오늘 외출하고 오느라 공부를 많이 못 했다..
대신 이번 주는 토일월 쉬니까 이때 많이 공부해야지

Retrospect 🧐

처음에 웹 개발 기초 콘텐츠에서 고차 함수 보자마자 저게 뭐여 하고 넘 무서워 보였는데 천천히 읽고 기록하며 공부하니까 나쁘지 않았다!! :)

0개의 댓글