5.1 기본 개념
고차 함수는 함수형 프로그래밍의 중요한 측면이며 JavaScript에서 널리 사용돼. 덕분에 코드를 추상적으로, 간결하고 재사용 가능하게 작성할 수 있어.
고차 함수란?
고차 함수 (higher-order functions)란 다른 함수를 인자로 받아들이거나 결과로 함수를 반환하는 함수야. 함수를 1급 객체로 다룰 수 있게 해줘서 더 추상적이고 모듈화된 프로그램을 만들 수 있어.
고차 함수의 예시
- 함수를 인자로 전달하기.
- 다른 함수에서 함수를 반환하기.
5.2 함수를 인자로 전달하기
내장 배열 메서드 사용하기
JavaScript는 forEach(), map(), filter(), reduce() 같은 고차 함수인 배열 메서드를 많이 제공해.
1. forEach() 메서드
forEach() 메서드는 배열의 각 요소에 대해 지정된 함수를 한 번씩 실행해.
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
// 출력: 1 2 3 4 5
2. map() 메서드
map() 메서드는 배열의 각 요소에 대해 지정된 함수를 호출한 결과로 새로운 배열을 만들어.
const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(function(number) {
return number * number;
});
console.log(squaredNumbers);
// 출력: [1, 4, 9, 16, 25]
3. filter() 메서드
filter() 메서드는 전달된 함수의 검사를 통과하는 모든 요소로 새로운 배열을 만들어.
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
console.log(evenNumbers);
// 출력: [2, 4]
4. reduce() 메서드
reduce() 메서드는 왼쪽에서 오른쪽으로 배열의 각 요소와 누산기에 함수를 적용해 하나의 값으로 줄여줘.
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce(function(total, number) {
return total + number;
}, 0);
console.log(sum);
// 출력: 15
5.3 다른 함수에서 함수를 반환하기
고차 함수는 다른 함수를 반환할 수 있어, 덕분에 더 유연하고 설정 가능한 함수를 만들 수 있어.
1. 커링 (Currying)
커링은 여러 인자를 받는 함수를 하나의 인자를 받고, 다음 인자를 받는 새 함수를 반환하는 형식으로 변환하는 과정이야.
커링 예시:
function multiply(a) {
return function(b) {
return a * b;
};
}
const multiplyByTwo = multiply(2);
console.log(multiplyByTwo(5)); // 출력: 10
const multiplyByThree = multiply(3);
console.log(multiplyByThree(5)); // 출력: 15
2. 사용자 지정 함수 생성
고차 함수는 인자를 통해 설정할 수 있는 함수를 생성할 수 있어.
예시:
function createGreeting(greeting) {
return function(name) {
console.log(`${greeting}, ${name}!`);
};
}
const sayHello = createGreeting('Hello');
sayHello('Alice'); // 출력: Hello, Alice!
const sayHi = createGreeting('Hi');
sayHi('Bob'); // 출력: Hi, Bob!
5.4 실용적인 활용
고차 함수의 실용적인 활용을 살펴보자.
compose() 함수
compose() 함수는 여러 함수를 하나로 결합하여 체인 방식으로 적용할 수 있게 해줘:
function compose(...functions) {
return function(initialValue) {
return functions.reduceRight((value, func) => func(value), initialValue);
};
}
const addOne = x => x + 1;
const double = x => x * 2;
const addOneAndDouble = compose(double, addOne);
console.log(addOneAndDouble(5)); // 출력: 12 (처음에 5에 1을 더하고 결과를 두 배로 만듦)
비동기 고차 함수
비동기 고차 함수는 API 요청이나 타이머 작업 같은 비동기 작업을 처리할 수 있게 해줘:
function fetchData(callback) {
setTimeout(() => {
callback('Data received');
}, 1000);
}
function processData(data) {
console.log(data);
}
fetchData(processData);
// 출력: Data received (1초 후)
GO TO FULL VERSION