[Java Script] 고차 함수

키워드 : 고차 함수, 일급 객체, 내장 고차 함수, 콜백 함수, 커링 함수, 메서드, filter, map, reduce, 추상화 ... 등

 

 

 

일급 객체(first-class citizen)

• 특별한 대우를 받는 객체.
• 대표 유형 : 함수 (함수가 일급객체이기에 고차함수로 활용이 가능한 것).
• 특징 :
  1. 변수에 할당 가능.
  2. 다른 함수의 전달인자로 전달 가능.
  3. 다른 함수의 결과로서 리턴 가능.

 

고차함수(Higher order function)

1. 함수를 전달인자(argument)로 받는 함수, 또는

2. 함수를 리턴하는 함수, 또는

3. 함수를 전달인자로 받아 함수를 리턴하는 함수. 

• 콜백 함수(callback function) : 다른 함수(caller)의 전달인자(argument)로 전달되는 함수.
• 고차 함수(caller)는 함수 내부에서 콜백 함수를 호출(invoke)할 수 있음.
• 커링 함수 :  고차 함수라는 용어를 '함수를 전달인자로 받는 함수'에만 한정해 사용. 정확하게는, 고차 함수가 커링 함수를 포함하는 개념.

 

---

 

내장 고차 함수

• JS에는 기본 내장된 고차 함수가 존재.
• 대표적인 내장 고차 함수 : 일부 배열 매서드 (arr.filter, arr.map, arr.reduce ...)

 

 

대표적인 내장 고차 함수인 몇 가지 배열 매서드에 대해 알아보도록 하자.

 

 

1. arr.filter

• 모든 배열의 요소 중에서 특정 조건을 만족하는 요소를 걸러내는 메서드.
• 분류 기준이 되는 조건은 함수로 표현되며, 이 함수가 filter 매서드의 전달 인자로 전달됨으로 고차 함수에 해당. 
• 콜백 함수 내부의 조건에 따라 참(true)이 리턴되면 분류.
• 조건에 맞는 데이터만 분류(filtering) 할 때 사용.
• 처리 과정 :
  • 배열의 각 요소가
  • 특정 논리(함수)에 따르면, 사실(true)일 때
  • 따로 분류한다(filter).

// 함수 표현식
const isEven = function (num) {
  return num % 2 === 0;
};

let arr = [1, 2, 3, 4];
// let output = arr.filter(짝수);
// '짝수'를 판별하는 함수가 조건으로서 filter 메서드의 전달인자로 전달됩니다.
let output = arr.filter(isEven);
console.log(output); // ->> [2, 4]

const isLteFive = function (str) {
  // Lte = less then equal
  return str.length <= 5;
};

arr = ['hello', 'code', 'states', 'happy', 'hacking'];
// output = arr.filter(길이 5 이하)
// '길이 5 이하'를 판별하는 함수가 조건으로서 filter 메서드의 전달인자로 전달됩니다.
let output = arr.filter(isLteFive);
console.log(output); // ->> ['hello', 'code', 'happy']

(출처 : 코드스테이츠)

 

 

2. arr.map

• 모든 배열의 요소에 동일한 행동을 준 값에 대해 모두 반환하는 메서드.
• map은 하나의 데이터를 다른 데이터로 매핑(mapping) 할 때 사용.
• 처리 과정 :
  • 배열의 각 요소가
  • 특정 논리(함수)에 의해
  • 다른 요소로 지정된다(map).

 

3. arr.reduce

• 누적값을 반환하는 메서드.
• 초기값을 정할 수 있으며, 정하지 않을 경우 배열의 첫번째 요소가 초기값이 됨.
• 여러 데이터를, 하나의 데이터로 응축(reduce)할 때 사용.
• 형식 : 배열명.reduce(콜백함수명, 초기값)
• 처리 과정 : 
  • 배열의 각 요소를
  • 특정 방법(함수)에 따라
  • 원하는 하나의 형태로
  • 응축한다(reduction).

 

---

 

추상화

복잡한 어떤 것을 압축해서 핵심만 추출한 상태로 만드는 것.

추상화 = 생산성(productivity)의 향상.

추상화의 관점에서 함수를 바라보면, 함수는 사고(thought) 또는 논리(logic)의 묶음.

함수를 통해 얻은 추상화를, 한 단계 더 높인 것이 고차 함수.

 

• 함수 = 값을 전달받아 값을 리턴한다 = 값에 대한 복잡한 로직은 감추어져 있다 = 값 수준에서의 추상화
• 고차 함수 = 함수를 전달받거나 함수를 리턴한다 = 사고(함수)에 대한 복잡한 로직은 감추어져 있다 = 사고 수준에서의 추상화

 

---

Question) 

 

Array.forEach()와 Array.map()의 정확한 차이점은 무엇일까?

둘 다 배열의 모든 요소를 순회하는데..

 

reference : https://fromnowwon.tistory.com/entry/forEach-map 

[Javascript] 반복문 for, forEach, map 차이점