While working with JavaScript arrays, you might have seen this error:

TypeError: Reduce of empty array with no initial value

This error is very common, especially when using the reduce() method.

In this post, we’ll understand:

• What this error means
• Why it happens
• How to fix it properly
• Best practices to avoid it

All explained in a simple and clear way.

What is reduce()?

Before understanding the error, let’s quickly recap:

reduce() is used to:

Convert an array into a single value (sum, object, etc.)

Example:

const numbers = [10, 20, 30];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 60

The Error

Now look at this:

[].reduce((acc, curr) => acc + curr);

👉 Output:

TypeError: Reduce of empty array with no initial value

Why Does This Error Occur?

To understand this, you must know how reduce() works internally.

Case 1: Without Initial Value

[10, 20, 30].reduce((acc, curr) => acc + curr);

Internally:

• acc = 10 (first element)
• curr = 20 (second element)

Then continues…

Problem with Empty Array

Now consider:

[].reduce((acc, curr) => acc + curr);

There is:

• ❌ No first element
• ❌ No second element
• ❌ Nothing to assign to acc

👉 JavaScript gets confused and throws an error.

Root Cause

reduce() needs an initial value or at least one element to start with.

If both are missing → 💥 Error

Solution 1: Always Provide Initial Value

[].reduce((acc, curr) => acc + curr, 0);

👉 Output:

0

Why this works:

• acc = 0 (initial value)
• No elements → loop doesn’t run
• Returns 0

Solution 2: Check Array Before Reduce

function sumArray(arr) {
  if (arr.length === 0) return 0;
  return arr.reduce((acc, curr) => acc + curr);
}

Solution 3: Safe Reduce Pattern

const sum = (arr || []).reduce((acc, curr) => acc + curr, 0);

👉 Handles:

• null
• undefined
• empty array

Real-World Scenario

Imagine:

const cartItems = [];

You calculate total:

const total = cartItems.reduce((sum, item) => sum + item.price);

💥 App crashes if cart is empty!

Correct Approach

const total = cartItems.reduce((sum, item) => sum + item.price, 0);

Common Mistake Developers Make

❌ Forgetting initial value:

arr.reduce((acc, curr) => acc + curr);

✅ Correct:

arr.reduce((acc, curr) => acc + curr, 0);

Best Practice

Always provide an initial value when using reduce()

Simple Analogy

Imagine you are adding numbers:

• If someone gives you numbers → you can start
• If no numbers are given → what will you add? 🤔

👉 You need a starting value (like 0)

With vs Without Initial Value

Interview Tip

If asked:

Why does this error occur?

Answer:

The error occurs because reduce() tries to use the first element as the accumulator, but in an empty array, no such element exists. Providing an initial value solves this issue.

🏁 Final Summary

• reduce() combines array elements into one value
• Without initial value:
  • Uses first element as accumulator
  • Fails for empty arrays
• With initial value:
  • Safe and predictable
  • Works for all cases

👉 Always use an initial value to avoid this error

💡 Found this helpful? Subscribe to get real-world coding tips, interview questions, and easy explanations directly in your inbox. Happy Coding!