[JavaScript 문법] 11일차: 배열 고급

고차 함수란?

고차 함수(Higher-Order Function)는 함수를 인수로 받거나 함수를 반환하는 함수입니다. 배열 고차 함수는 배열을 처리하는데 매우 유용합니다.

배열 고차 함수

forEach

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

let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.forEach(function(fruit, index) {
  console.log(index + ': ' + fruit);
});
// 출력:
// 0: Apple
// 1: Banana
// 2: Cherry

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

reduceRight

reduceRight 메서드는 reduce 메서드와 유사하지만, 배열의 끝에서부터 시작하여 값을 축약합니다.

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

every

every 메서드는 배열의 모든 요소가 조건을 만족하는지 확인합니다. 모든 요소가 조건을 만족하면 true, 그렇지 않으면 false를 반환합니다.

let numbers = [2, 4, 6, 8];
let allEven = numbers.every(function(number) {
  return number % 2 === 0;
});
console.log(allEven); // true

some

some 메서드는 배열의 일부 요소가 조건을 만족하는지 확인합니다. 하나 이상의 요소가 조건을 만족하면 true, 그렇지 않으면 false를 반환합니다.

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

find

find 메서드는 조건을 만족하는 첫 번째 요소를 반환합니다. 조건을 만족하는 요소가 없으면 undefined를 반환합니다.

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

findIndex

findIndex 메서드는 조건을 만족하는 첫 번째 요소의 인덱스를 반환합니다. 조건을 만족하는 요소가 없으면 -1을 반환합니다.

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

sort

sort 메서드는 배열의 요소를 정렬합니다. 기본적으로 요소를 문자열로 변환하여 유니코드 순서로 정렬합니다. 숫자 정렬을 위해 비교 함수를 제공합니다.

let fruits = ['Banana', 'Apple', 'Cherry'];
fruits.sort();
console.log(fruits); // ['Apple', 'Banana', 'Cherry']

let numbers = [3, 1, 4, 1, 5, 9];
numbers.sort(function(a, b) {
  return a - b;
});
console.log(numbers); // [1, 1, 3, 4, 5, 9]

reverse

reverse 메서드는 배열의 요소 순서를 반전합니다.

let numbers = [1, 2, 3];
numbers.reverse();
console.log(numbers); // [3, 2, 1]

배열 고급 활용 예제

중복 요소 제거

let numbers = [1, 2, 3, 2, 4, 3, 5];
let uniqueNumbers = numbers.filter(function(value, index, self) {
  return self.indexOf(value) === index;
});
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]

 

배열 합치기 및 중복 제거

let array1 = [1, 2, 3];
let array2 = [2, 3, 4];
let mergedArray = array1.concat(array2);
let uniqueMergedArray = mergedArray.filter(function(value, index, self) {
  return self.indexOf(value) === index;
});
console.log(uniqueMergedArray); // [1, 2, 3, 4]

결론

배열 고차 함수는 배열을 효율적으로 처리하고, 다양한 작업을 수행할 수 있는 강력한 도구입니다. 이번 글에서는 forEach, map, filter, reduce, reduceRight, every, some, find, findIndex, sort, reverse 등의 배열 메서드와 그 활용 방법에 대해 배웠습니다. 다음 글에서는 ES6 클래스에 대해 알아보겠습니다.

다음 글에서 만나요!