Reduce Sum of Array with Undefined Values in JavaScript

If you're working with arrays in JavaScript, you may encounter situations where your array contains undefined values. This can happen when you're processing data from various sources or working with incomplete datasets.
One common problem developers face is summing the values of an array with undefined elements. JavaScript's reduce() method is a versatile tool that can help you solve this problem efficiently. In this article, we will explore how to use the reduce() method to sum an array, even when it includes undefined values, and ensure that the final result is correct.

What is the reduce() Method in JavaScript?

The reduce() method in JavaScript is a powerful tool that allows you to iterate over an array and accumulate a single result. It takes a callback function as its first argument, which receives four parameters:

• Accumulator: The accumulated value returned by the previous iteration (or the initial value if provided).
  
• Current Value: The current element being processed in the array.
  
• Current Index: The index of the current element.
  
• Array: The original array on which reduce() is called.

The result of each iteration is passed along as the accumulator for the next iteration, and at the end of the loop, the final result is returned.

What is filter method?

We first use the filter() method to create a new array that only contains valid numbers (i.e., excluding undefined values). The filter condition checks that the type of each element is a number and that it's not NaN.

Using reduce() with a Check for undefined

To sum the values of the array while safely handling undefined values, we can modify the reduce() method by checking whether the current value is a valid number before adding it to the accumulator.

Example

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));

Output

698

Time Complexity: O(n)
Space Complexity: O(1)

Filtering undefined Values First

Alternatively, you could filter out undefined values from the array before performing the sum. This can be done using the filter() method to remove the undefined values, and then using reduce() to sum the remaining numbers.

The callback function checks if the current value (curr) is a valid number using the typeof operator and isNaN(). If the value is valid, it adds the value to the accumulator (acc); otherwise, it just returns the accumulator unchanged.

Example

const arr = [5, undefined, 7, undefined, 3, undefined];
 // Filter out undefined values
const sum = arr.filter(x => typeof x === 'number' && !isNaN(x)).reduce((acc, curr) => acc + curr, 0); 
// Sum the remaining numbers

console.log(sum);

Output

15

Time Complexity: O(n)

Space Complexity: O(n)