JavaScript에서 null 또는 undefined가 포함된 배열 요소의 합계 계산하기

배열 안에 여러 개의 하위 배열이 있고, 각 하위 배열에는 숫자와 함께 undefined나 null 값이 섞여 있다고 가정해 보겠습니다. 이때 각 하위 배열 요소들의 합계를 새로운 배열의 요소로 만들어야 하며, undefined와 null은 0으로 취급해서 계산해야 합니다.

예제 데이터

다음은 문제에서 사용할 샘플 배열입니다.

const arr = [
  [12, 56, undefined, 5],
  [undefined, 87, 2, null],
  [3, 6, 32, 1],
  [undefined, null]
];

풀이 코드

forEach() 메서드로 각 하위 배열을 순회하고, reduce() 메서드로 요소들의 합계를 구합니다. 이때 (acc || 0)과 (val || 0) 패턴을 활용하면 값이 null이나 undefined일 때 자동으로 0이 더해지므로 별도의 조건문 없이 깔끔하게 처리할 수 있습니다.

const arr = [
  [12, 56, undefined, 5],
  [undefined, 87, 2, null],
  [3, 6, 32, 1],
  [undefined, null]
];

const newArr = [];
arr.forEach((sub, index) => {
  newArr[index] = sub.reduce((acc, val) => (acc || 0) + (val || 0));
});

console.log(newArr);

실행 결과

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

[ 73, 89, 42, 0 ]

코드 동작 원리

reduce()는 하위 배열의 각 요소를 순차적으로 더하는데, 논리 OR 연산자(||) 덕분에 null과 undefined처럼 falsy한 값은 모두 0으로 대체됩니다. 예를 들어 첫 번째 하위 배열 [12, 56, undefined, 5]는 12 + 56 + 0 + 5 = 73이 되고, 마지막 하위 배열 [undefined, null]은 두 값이 모두 0으로 처리되어 최종 결과가 0이 됩니다. 이처럼 || 연산자를 활용하면 결측값이 포함된 배열도 안전하게 합산할 수 있습니다.