자바스크립트 Reduce로 배열 다루기

Reduce()는 배열의 각 요소를 순환하면서 누적된 값을 반환하는 함수입니다. 이를 통해 배열을 다루는데 유용합니다. Reduce()를 사용하면 코드를 더욱 간결하게 작성할 수 있습니다.

Reduce()의 구문

array.reduce(callback, initialValue);

Reduce 함수는 콜백 함수와 초기값이 필요합니다. 콜백 함수는 4가지의 인자를 가지고 있습니다.

function callback(accumulator, currentValue, currentIndex, array) {
   // Your code here
}

accumulator는 누산기로 콜백 함수에서 반환되는 값이 누적됩니다. currentValue는 현재 값을 나타내며 currentIndex는 현재 인덱스를 나타냅니다. 마지막으로 array는 원래 배열입니다.

Reduce()의 예시

const arr = [1, 2, 3, 4, 5];

const total = arr.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);

console.log(total); // 15

위 예제는 1부터 5까지의 배열의 값을 더하는 간단한 Reduce() 예제입니다. 초기값은 0이며 1부터 5까지 총 15를 반환합니다.

reduce()를 사용한 객체 계산

const fruits = [
   { name: 'apple', count: 3 },
   { name: 'banana', count: 2 },
   { name: 'orange', count: 5 },
];

const countFruits = fruits.reduce((total, fruit) => {
   return total + fruit.count;
}, 0);

console.log(countFruits); // 10

위 예제는 과일 배열의 과일 개수를 합산하는 예제입니다.

추가 설명: 자바스크립트 Reduce() 함수는 배열을 다루는데 유용합니다. 각 요소의 값을 더하거나, 각 객체의 값을 합산하는 등의 작업에 활용할 수 있습니다. Reduce() 함수는 코드를 더욱 간단하게 작성할 수 있도록 도와줍니다.