How to Resolve "TypeError: Reduce of empty array with no initial value" Error in JavaScript
The TypeError: Reduce of empty array with no initial value is a common error in JavaScript that occurs when you call the Array.prototype.reduce() method on an array that is empty, but you have not provided an initialValue for the operation.
This guide will explain the fundamental reason this error happens by clarifying the two ways reduce() can operate. More importantly, it will show you the simple, universal solution: always provide an initial value.
The Core Problem: How reduce() Works Without an Initial Value
The reduce() method has two distinct modes of operation depending on whether you provide the second argument, the initialValue.
array.reduce(callbackFn, initialValue)
where:
- With an
initialValue: Theaccumulatorstarts asinitialValue, and the loop begins with the first element of the array. - Without an
initialValue: Theaccumulatorstarts as the first element of the array (array[0]), and the loop begins with the second element (array[1]).
The error occurs in the second mode. If the array is empty, there is no array[0] to use as the starting value for the accumulator, so the reduce() method doesn't know what to do and throws a TypeError.
Example of problem:
// Problem: An empty array has no first element to use as a starting value.
let emptyArray = [];
// This will throw the error because there is no initial value provided.
let sum = emptyArray.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
});
Error Output:
Uncaught TypeError: Reduce of empty array with no initial value
The Solution: Always Provide an Initial Value
The solution is to always provide the second argument (initialValue) to the reduce() method. This makes the behavior of reduce() predictable and safe, even for empty arrays.
If you call .reduce() on an empty array with an initial value, the reduce() method will simply return the initial value immediately without ever running the callback function.
let emptyArray = [];
// Correct: Provide an initial value (0 for a sum).
let sum = emptyArray.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
}, 0); // <-- Initial value is provided here
console.log(sum); // Output: 0
Because an initial value was provided, the operation on the empty array is safe and returns the expected starting value of 0.
A Common Scenario: Chaining filter() and reduce()
This error frequently appears when you chain filter() before reduce(). It's possible that your filter() operation could remove all elements from the array, resulting in an empty array being passed to reduce().
Example of problem:
let numbers = [10, 20, 30];
// Problem: The filter removes all elements, creating an empty array.
let sumOfHighNumbers = numbers
.filter(num => num > 50) // This returns []
.reduce((acc, num) => acc + num); // .reduce() is then called on [] without an initial value
This will throw the "Reduce of empty array" error.
Solution: by adding an initial value to reduce(), the code becomes robust and handles the "no matching elements" case gracefully.
let numbers = [10, 20, 30];
let sumOfHighNumbers = numbers
.filter(num => num > 50)
.reduce((acc, num) => acc + num, 0); // <-- Add the initial value
console.log(sumOfHighNumbers); // Output: 0
Choosing the Right Initial Value
The correct initial value depends on the goal of your reduce() operation.
- For summing numbers, the initial value is
0. - For multiplying numbers, the initial value is
1. - For building a new array, the initial value is an empty array (
[]). - For building a new object, the initial value is an empty object (
{}). - For concatenating strings, the initial value is an empty string (
'').
Conclusion
The TypeError: Reduce of empty array with no initial value is a clear signal that you have not accounted for the possibility of an empty array.
- The root cause is calling
reduce()without a second argument (theinitialValue) on an array that might be empty. - The solution is simple and universal: Always provide an
initialValueto thereduce()method.
This small change makes your code more robust, more readable, and completely prevents this common error.