JavaScript 객체 배열에서 동일한 키 값 합산하기

다음과 같은 객체 배열이 있다고 가정해 보겠습니다.

const arr = [{a: 2, b: 5, c: 6}, {a:3, b: 4, d:1},{a: 1, d: 2}];

하나의 객체가 유효하기 위해서는 객체 내부의 키들이 서로 중복되지 않는 고유한 값이어야 합니다. 하지만 서로 다른 객체들끼리는 공통된 키를 가질 수 있습니다.

이번 문제에서 요구되는 것은 이러한 배열을 입력받아, 배열 전체에 존재하는 모든 고유 키를 추출하고 각 키에 해당하는 값들의 누적 합을 구해 하나의 객체로 반환하는 자바스크립트 함수를 작성하는 것입니다.

따라서 최종 결과 객체는 다음과 같은 형태가 되어야 합니다.

const output = {a: 6, b: 9, c: 6, d: 3};

예제 코드

다음은 위 문제를 해결하는 코드입니다.

const arr = [{a: 2, b: 5, c: 6}, {a: 3, b: 4, d:1}, {a: 1, d: 2}];
const sumArray = arr => {
   const res = {};
   for(let i = 0; i < arr.length; i++){
      Object.keys(arr[i]).forEach(key => {
         res[key] = (res[key] || 0) + arr[i][key];
      });
   };
   return res;
};
console.log(sumArray(arr));

코드 설명

이 코드의 핵심 로직은 다음과 같이 동작합니다.

• 결과를 담을 빈 객체 res를 먼저 생성합니다.
• 반복문으로 배열의 각 객체를 순회하면서 Object.keys()로 해당 객체의 모든 키를 가져옵니다.
• 각 키에 대해 (res[key] || 0) 표현식을 사용해, 결과 객체에 이미 해당 키가 존재하면 기존 값을 더하고, 없으면 0부터 더하기 시작합니다.

이처럼 (res[key] || 0) 패턴은 키의 존재 여부를 확인하고 초기값을 처리하는 데 매우 유용하게 활용되는 자바스크립트 관용구입니다.

출력 결과

위 코드를 실행하면 콘솔에 다음과 같은 결과가 출력됩니다.

{ a: 6, b: 9, c: 6, d: 3 }

키 a는 세 객체에 모두 존재하므로 2 + 3 + 1 = 6이 되고, 키 b는 두 객체에 존재하므로 5 + 4 = 9, 키 c는 6, 키 d는 1 + 2 = 3으로 정확히 누적 합산된 것을 확인할 수 있습니다.