JS/Javascript

[javascript] 배열 7/ 배열 축약, 누적 (reduce, reduceRight)

ui-o 2025. 9. 30. 16:17
반응형

reduce() / reduceRight() 특징

  • 초기값이 없으면 배열 첫 요소가 누적값으로 사용됨  (단, 빈 배열에서 초기값 없으면 오류 발생)
  • 원본 배열 변경 없음 : reduce()/reduceRight()는 순회만 하고 배열을 변형하지 않음
  • 체이닝 가능 : map(), filter() 등과 결합해서 사용 가능

reduce()

  • reduce()는 배열의 각 요소를 순회하면서 누적 계산을 수행하고, 최종적으로 하나의 값으로 축약할 때 사용
  • 합계, 평균, 객체 변환, 문자열 결합 등 일반적인 누적 계산

기본 문법

배열.reduce((누적값, 현재값, 인덱스, 배열) => {
  // 누적 계산 로직
  return 누적값;
}, 초기값);
요소 설명
누적값(acc) 이전 계산 결과를 담는 변수
현재값(cur) 현재 배열 요소
인덱스(index) 현재 요소의 인덱스 (선택)
배열(array) 현재 처리 중인 배열 (선택)
초기값(initialValue) 누적 계산 시작 값  

reduce() 예제

// ex) 숫자 합계
const nums = [1, 2, 3, 4];
const sum = nums.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 10
// ex) 평균 게산
const avg = nums.reduce((acc, cur) => acc + cur, 0) / nums.length;
console.log(avg); // 2.5
// ex) 문자열 결합
const chars = ['a', 'b', 'c'];
const str = chars.reduce((acc, cur) => acc + cur, '');
console.log(str); // 'abc'
// ex) 객체 변환
const users = [
  {id: 1, name: 'Alice'},
  {id: 2, name: 'Bob'}
];

const userObj = users.reduce((acc, cur) => {
  acc[cur.id] = cur.name;
  return acc;
}, {});

console.log(userObj); // {1: 'Alice', 2: 'Bob'}

reduceRight()

  • reduce()와 거의 동일하지만, 오른쪽에서 왼쪽으로 순회
  • 용도 : 문자열 역순, 스택/후입선출(LIFO) 계산, 순서가 중요한 경우

reduceRight() 예제

// ex) 문자열 역순 결합
const chars = ['a', 'b', 'c'];
const reversedStr = chars.reduceRight((acc, cur) => acc + cur, '');
console.log(reversedStr); // 'cba'
// ex) 숫자 배열
const nums = [1, 2, 3, 4];
const diff = nums.reduceRight((acc, cur) => acc - cur, 0);
console.log(diff); // 계산 순서: 0-4 → -4, -4-3 → -7, -7-2 → -9, -9-1 → -10

반응형