JavaScript에서 2차원 배열의 열별 합계 구하기

배열 안에 여러 개의 배열이 중첩된 형태(2차원 배열)가 주어졌을 때, 이 배열을 입력받아 각 인덱스 위치에 해당하는 요소들의 합계를 담은 새로운 배열을 반환하는 함수를 작성해야 하는 경우가 있습니다.

예를 들어, 원본 배열이 다음과 같다면 −

[
    [43, 2, 21],
    [1, 2, 4, 54],
    [5, 84, 2],
    [11, 5, 3, 1]
]

출력 결과

각 열(인덱스)별 요소의 합계는 다음과 같이 계산됩니다.

• 첫 번째 열: 43 + 1 + 5 + 11 = 60
• 두 번째 열: 2 + 2 + 84 + 5 = 93
• 세 번째 열: 21 + 4 + 2 + 3 = 30
• 네 번째 열: 54 + 1 = 55

따라서 최종 출력은 다음과 같습니다.

[60, 93, 30, 55]

sumArray() 함수 작성하기

그럼 실제로 동작하는 sumArray() 함수를 작성해 보겠습니다.

전체 코드 예제

const arr = [
    [43, 2, 21],
    [1, 2, 4, 54],
    [5, 84, 2],
    [11, 5, 3, 1]
];
const sumArray = (array) => {
    const newArray = [];
    array.forEach(sub => {
        sub.forEach((num, index) => {
            if(newArray[index]){
                newArray[index] += num;
            }else{
                newArray[index] = num;
            }
        });
    });
    return newArray;
}
console.log(sumArray(arr));

코드 설명

위 코드의 동작 방식은 다음과 같습니다.

1. 먼저 결과를 저장할 빈 배열 newArray를 생성합니다.
2. forEach를 사용해 원본 배열의 각 하위 배열을 순회합니다.
3. 하위 배열의 각 숫자를 인덱스(index)와 함께 확인합니다.
4. 해당 인덱스의 합계 값이 이미 존재하면 기존 값에 현재 숫자를 더하고, 존재하지 않으면 현재 숫자를 초기값으로 설정합니다.
5. 모든 순회가 끝나면 합계가 저장된 새로운 배열을 반환합니다.

이 방식은 각 하위 배열의 길이가 서로 달라도 정상적으로 동작한다는 장점이 있습니다. 길이가 짧은 하위 배열은 해당 인덱스에 값이 없으므로 자연스럽게 건너뛰기 때문입니다.

reduce를 활용한 대안 코드

reduce 메서드를 활용하면 좀 더 간결하게 표현할 수도 있습니다.

const sumArray = (array) =>
    array.reduce((acc, sub) => {
        sub.forEach((num, index) => {
            acc[index] = (acc[index] || 0) + num;
        });
        return acc;
    }, []);

출력 결과

콘솔에 출력되는 결과는 다음과 같습니다.

[ 60, 93, 30, 55 ]