고차함수(Higher-Order function, HOF)와 콜백함수(callback function)

고차함수와 콜백함수의 배경

function repeat(n) {
  for (let i = 0; i < n; i++) {
    console.log(n);
  }
}

repeat(5); 
// 0 1 2 3 4

function repeat2(n) {
  for (let i = 0; i < n; i++) {
    if (i % 2) {
      console.log(i);
    }
  }
}

repeat2(5);
// 1 3

repeat1과 repeat2의 공통점을 보면 for문, 즉 반복적인일은 같지만 안에 내용이 달라진다.
일부분만 달라졌는데 매번 새로운 함수를 만드는 것은 비효율적이다.

콜백함수(callback function)

함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수
즉, 매개변수로 들어가는 함수를 뜻한다.

function repeat(n, f) {
  for (let i = 0; i < n; i++) {
    f(i);
  }
}

function logAll(i) {
  console.log(i);
}

repeat(5, logAll); // 0 1 2 3 4

위에서본 repeat1을 바꾼것이다. 변한점을 살펴보자

먼저 repeat의 매개변수가 하나에서 두개로 바뀌었다.
내용을 보면 'console.log(i)'의 부분이 'f(i)'로 바뀌었다. 즉, 매개변수로 받은 'f'는 함수이다.

repeat를 호출하는 명령어를 살펴보면 매개변수 'f'의 자리에 logAll, 함수가 들어갔다.
처음 'console.log(i)'의 역할을 logAll함수가 대신 해준것이다.

이것 logAll함수가 바로 callback함수이다.

고차함수(Higher-Order function, HOF)

매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수
즉, 매개변수로 다른 함수를 받는 함수를 뜻한다.

function repeat(n, f) {
  for (let i = 0; i < n; i++) {
    f(i);
  }
}

function logAll(i) {
  console.log(i);
}

repeat(5, logAll); // 0 1 2 3 4

위의 코드에서 repeat함수가 바로 고차함수가 된다.

JS 내장 고차함수

JS의 배열에 관한 내장 고차함수들은 여러가지가 존재한다.
reduce, forEach, find, filter, map 등등...
나의 블로그 게시물에서도 확인할 수 있다.