고차함수 / 내장 고차함수

MihyunCho·2021년 3월 16일

[Javascript] 펀앤모던한 자바스크립트 공부

목록 보기

2/15

자바스크립트의 퍼스트클래스 고차함수.

일급 객체인 고차함수의특징은 이렇다.

변수에 할당(assignment)할 수 있다.

다른 함수의 인자(argument)로 전달될 수 있다.

다른 함수의 결과로서 리턴될 수 있다.

함수를 변수에 저장하는 방법에 대해서 이미 배웠는데, 함수 표현식이라고 한다.
함수 표현식(function expression)은 함수 선언식(function declaration)과 달리 호이스팅(hoisting)이 적용되지 않는다.

호이스팅에 지나치게 의존하는 것은 코드의 유지보수 측면에서 좋지 않다고 한다. 코드 리뷰나 디버깅을 할 때 위아래로 왔다 갔다 하게 될 수 있기 때문이다.
함수 선언식의 경우에는 어느 위치나 함수를 선언할 수 있고, 함수 실행 위치도 중요하지 않지만 함수 표현식은 함수의 할당과 실행 위치가 중요하기 때문에 코드의 위치가 예측 가능하다.

고차함수

고차 함수(higher order function)는 함수를 인자(argument)로 받거나 함수를 리턴하는 함수를 말한다.
이 때 다른 함수(caller)의 인자(argument)로 전달되는 함수를 콜백 함수(callback function)라고 한다.

내장 고차함수

자바스크립트에 기본적으로 빌트인되어 있는 내장 고차함수는 아래와 같은 것들이 있다.

filter
forEach
find
map
reduce
sort
some
every 등

이 중 흔하게 쓰이고, 또 중요한 몇가지만 정리하려고 한다.

filter

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

구문
arr.filter(callback(element[, index[, array]])[, thisArg])

반환값
테스트를 통과한 요소로 이루어진 새로운 배열. 어떤 요소도 테스트를 통과하지 못했으면 빈 배열을 반환합니다.

map

map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.

const array1 = [1, 4, 9, 16];
const map1 = array1.map(x => x * 2);
console.log(map1);
// expected output: Array [2, 8, 18, 32]

구문
arr.map(callback(currentValue[, index[, array]])[, thisArg])

반환값
배열의 각 요소에 대해 실행한 callback의 결과를 모은 새로운 배열.

reduce

reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다.

const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

console.log(array1.reduce(reducer));
// expected output: 10

console.log(array1.reduce(reducer, 5));
// expected output: 15