본문 바로가기
JavaScript 문법 시리즈

[JavaScript 문법] 16일차: 고차 함수

by cogito21_js 2024. 8. 16.
반응형

고차 함수란?

고차 함수(Higher-Order Function)는 다음 중 하나를 만족하는 함수입니다:

  1. 함수를 인수로 받을 수 있는 함수.
  2. 함수를 반환할 수 있는 함수.

고차 함수는 함수형 프로그래밍에서 중요한 역할을 하며, 코드의 재사용성을 높이고 가독성을 개선하는 데 유용합니다.

콜백 함수

콜백 함수는 다른 함수의 인수로 전달되어 실행되는 함수입니다.

예제

function greet(name) {
  console.log('Hello, ' + name);
}

function processUserInput(callback) {
  let name = 'Alice';
  callback(name);
}

processUserInput(greet); // 'Hello, Alice'

배열 고차 함수

JavaScript의 배열 메서드는 고차 함수를 활용하여 배열을 처리하는 다양한 방법을 제공합니다.

forEach

forEach 메서드는 배열의 각 요소에 대해 지정된 함수를 실행합니다.

let numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
  console.log(number);
});
// 출력: 1, 2, 3, 4, 5

map

map 메서드는 배열의 각 요소에 대해 지정된 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.

let numbers = [1, 2, 3];
let doubled = numbers.map(function(number) {
  return number * 2;
});
console.log(doubled); // [2, 4, 6]

filter

filter 메서드는 배열의 각 요소에 대해 지정된 함수를 호출하여, 그 결과가 참인 요소들만 모아 새로운 배열을 반환합니다.

let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(function(number) {
  return number % 2 === 0;
});
console.log(evenNumbers); // [2, 4]

reduce

reduce 메서드는 배열의 각 요소에 대해 지정된 함수를 호출하여, 하나의 값을 반환합니다. 초기값을 설정할 수 있으며, 설정하지 않으면 첫 번째 요소가 초기값이 됩니다.

let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(total, number) {
  return total + number;
}, 0);
console.log(sum); // 15

함수 반환

고차 함수는 함수를 반환할 수 있습니다. 이는 함수가 다른 함수에 의해 동적으로 생성될 수 있음을 의미합니다.

예제

function createMultiplier(multiplier) {
  return function(value) {
    return value * multiplier;
  };
}

let double = createMultiplier(2);
let triple = createMultiplier(3);

console.log(double(5)); // 10
console.log(triple(5)); // 15

함수형 프로그래밍의 기본 개념

고차 함수는 함수형 프로그래밍에서 중요한 역할을 하며, 코드의 재사용성과 유지보수성을 높이는 데 기여합니다.

예제

let numbers = [1, 2, 3, 4, 5];

// 제곱한 값을 새로운 배열로 반환
let squares = numbers.map(function(number) {
  return number * number;
});
console.log(squares); // [1, 4, 9, 16, 25]

// 짝수만 필터링하여 새로운 배열로 반환
let evenNumbers = numbers.filter(function(number) {
  return number % 2 === 0;
});
console.log(evenNumbers); // [2, 4]

// 배열의 모든 요소를 더한 값을 반환
let sum = numbers.reduce(function(total, number) {
  return total + number;
}, 0);
console.log(sum); // 15

고차 함수의 활용 예제

고차 함수를 사용하여 반복적인 작업을 추상화하고, 코드를 더욱 간결하게 작성할 수 있습니다.

예제: 배열 변환 및 필터링

let students = [
  { name: 'Alice', score: 85 },
  { name: 'Bob', score: 92 },
  { name: 'Charlie', score: 88 },
  { name: 'Dave', score: 95 },
  { name: 'Eve', score: 78 }
];

// 점수가 90 이상인 학생들의 이름만 반환
let highScorers = students
  .filter(function(student) {
    return student.score >= 90;
  })
  .map(function(student) {
    return student.name;
  });

console.log(highScorers); // ['Bob', 'Dave']

고차 함수의 장점

  1. 코드 재사용성: 고차 함수를 사용하여 동일한 로직을 여러 곳에서 재사용할 수 있습니다.
  2. 코드 가독성: 고차 함수를 사용하여 코드를 더 읽기 쉽고 이해하기 쉽게 만들 수 있습니다.
  3. 추상화: 반복적인 작업을 고차 함수로 추상화하여 코드의 중복을 줄일 수 있습니다.

고차 함수의 단점

  1. 성능: 고차 함수를 사용하면 성능에 영향을 미칠 수 있습니다. 특히, 대규모 데이터 셋을 처리할 때 주의가 필요합니다.
  2. 디버깅: 고차 함수의 사용은 디버깅을 어렵게 만들 수 있습니다. 특히, 익명 함수나 중첩된 함수를 사용할 때 디버깅이 복잡해질 수 있습니다.

결론

고차 함수는 JavaScript에서 중요한 역할을 하며, 코드의 재사용성과 가독성을 높이는 데 유용합니다. 이번 글에서는 고차 함수의 기본 개념, 콜백 함수, 배열 고차 함수, 함수 반환, 함수형 프로그래밍의 기본 개념, 고차 함수의 활용 예제, 장점과 단점에 대해 배웠습니다. 다음 글에서는 함수형 프로그래밍에 대해 더 깊이 알아보겠습니다.

다음 글에서 만나요!

 

반응형