[JS] reduce() 함수 사용법과 예시

🧩 자바스크립트 reduce() 함수 완벽 정리

✅ reduce()란?

reduce()는 배열의 모든 요소를 하나의 결과값으로 줄이는 함수다.
배열의 합계를 구하거나, 최대값을 찾거나, 데이터를 집계할 때 자주 사용된다.

쉽게 말하면 “배열을 하나의 값으로 누적 계산하는 함수”

 

---

📘 기본 문법

array.reduce((accumulator, currentValue, currentIndex, array) => {
  // 누적해서 계산할 로직
}, initialValue);

매개변수	설명
accumulator	이전 단계에서 누적된 결과값
currentValue	현재 처리 중인 배열 요소
currentIndex	현재 인덱스 (선택사항)
array	원본 배열 (선택사항)
initialValue	초깃값 (선택사항이지만 중요!)

 

💡 예제 1. 배열의 합 구하기

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

const sum = numbers.reduce((acc, cur) => {
  return acc + cur;
}, 0);

console.log(sum); // 👉 15

 

🧠 동작 과정

단계	acc	cur	결과
1	0	1	1
2	1	2	3
3	3	3	6
4	6	4	10
5	10	5	15

➡ 최종 결과는 15

 

🎯 예제 2. 배열의 최대값 구하기

const numbers = [10, 5, 8, 21, 3];

const max = numbers.reduce((acc, cur) => {
  return acc > cur ? acc : cur;
});

console.log(max); // 👉 21

초기값을 지정하지 않으면 첫 번째 요소(10)이 acc로 사용된다.

 

🧱 예제 3. 객체 배열 합치기 (장바구니 예시)

const cart = [
  { name: "사과", price: 1000 },
  { name: "바나나", price: 2000 },
  { name: "체리", price: 3000 },
];

const total = cart.reduce((acc, item) => acc + item.price, 0);

console.log(total); // 👉 6000

쇼핑몰 장바구니 총합 계산처럼 “누적합”이 필요한 상황에 사용한다.

 

🧮 예제 4. 배열을 객체로 변환하기

const fruits = ["apple", "banana", "apple", "orange", "banana", "apple"];

const count = fruits.reduce((acc, fruit) => {
  acc[fruit] = (acc[fruit] || 0) + 1;
  return acc;
}, {});

console.log(count);
// 👉 { apple: 3, banana: 2, orange: 1 }

reduce()는 단순 숫자 계산뿐 아니라 데이터 집계나 변환에도 매우 유용하다.

 

🔁 자주 쓰이는 패턴 요약

상황	예시 코드	결과
합계 구하기	[1,2,3].reduce((a,b)=>a+b,0)	6
최대값	[1,5,2].reduce((a,b)=>a>b?a:b)	5
객체로 묶기	`배열.reduce((a,v)=>({...a,[v]:(a[v]
배열 평탄화	[[1],[2],[3]].reduce((a,b)=>a.concat(b),[])	[1,2,3]

 

🪄 마무리 정리

reduce()는 배열을 하나의 값으로 “요약(축소)”할 때 쓰는 강력한 함수
단순한 합계뿐 아니라, 객체 변환 / 데이터 통계 / 배열 병합 등 다양한 곳에서 활용할 수 있다.

 

✨ 한줄 요약

“배열의 데이터를 하나로 모으고 싶을 땐 reduce()를 떠올려라!”