JavaScript reduce로 undefined·null 값을 제외한 배열 합계 구하기

실무에서 숫자 배열을 다루다 보면 undefined나 null 같은 값이 섞여 있는 경우가 종종 있습니다. 이럴 때 배열을 인자로 받아 undefined와 null 값을 무시하고, 나머지 숫자들의 합계만 깔끔하게 반환하는 함수를 만들어야 할 필요가 생깁니다.

해결 방법: reduce 활용하기

JavaScript의 reduce() 메서드를 사용하면 이 문제를 매우 간단하게 해결할 수 있습니다. 핵심 아이디어는 누적값에 더하기 전, 현재 값이 유효한 숫자인지 확인하는 것입니다.

(val || 0) 표현식을 사용하면 값이 null, undefined, 또는 falsy한 값일 때 자동으로 0을 더하게 되어 오류 없이 합계를 계산할 수 있습니다.

예제 코드

const arr = [23, 566, null, 90, -32, undefined, 32, -69, 88, null];

const quickSum = (arr) => {
    const sum = arr.reduce((acc, val) => {
        return acc + (val || 0);
    }, 0);
    return sum;
};

console.log(quickSum(arr));

실행 결과

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

698

코드 설명

reduce()의 초기값을 0으로 설정했기 때문에 빈 배열이 들어오더라도 안전하게 0이 반환됩니다. 각 요소가 처리될 때마다 (val || 0)에 의해 null과 undefined는 0으로 대체되어 최종 합계에 영향을 주지 않습니다.

참고로 위 예제에서 유효한 숫자들은 23 + 566 + 90 - 32 + 32 - 69 + 88 = 698이므로, 정확히 의도한 결과가 출력되는 것을 확인할 수 있습니다.