Finding the sum of array elements is one of the most common tasks in JavaScript.
While there are multiple ways to do it, the reduce() method is the most powerful and preferred approach.

In this post, you’ll learn:

• What reduce() is ?
• How to use it to find sum
• Step-by-step execution (very important)
• What happens if you don’t provide initial value
• Common mistakes to avoid

Let’s get started 👇

---

What is reduce() in JavaScript?

The reduce() method is used to:

Convert an array into a single value

This value can be:

• Sum
• Product
• Object
• String

---

Problem Statement

Write a JavaScript program to find the sum of array elements using reduce().

---

Basic Example

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

---

Understanding the Syntax

array.reduce((acc, curr) => acc + curr, initialValue);

Parameters:

• acc → accumulator (stores result)
• curr → current element
• initialValue → starting value (important!)

---

Step-by-Step Execution (Very Important)

Let’s understand how this works internally.

Input:

[10, 20, 30, 40]

Code:

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

---

Execution Flow Table

Step	acc	curr	Operation	Result
1	0	10	0 + 10	10
2	10	20	10 + 20	30
3	30	30	30 + 30	60
4	60	40	60 + 40	100

---

Final Output

100

---

How reduce() Works Internally

You can think of reduce() like this:

let acc = 0;for (let i = 0; i < numbers.length; i++) {
  acc = acc + numbers[i];
}

👉 It keeps updating the acc value until all elements are processed.

---

What Happens If You Don’t Provide Initial Value?

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

---

Execution Without Initial Value

Step	acc	curr	Result
Start	10	20	30
Next	30	30	60
Next	60	40	100

👉 Here:

• acc starts as first element (10)
• Loop starts from second element (20)

---

Problem with Empty Array

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

👉 💥 Error:

TypeError: Reduce of empty array with no initial value

Link : TypeError: Reduce of Empty Array with No Initial Value (Fix Explained)

---

Best Practice

Always use initial value:

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

---

Common Mistakes

1. Forgetting initial value

👉 Can cause errors

---

2. Using map() instead of reduce()

👉 Wrong approach for sum

---

3. Not understanding execution flow

👉 Leads to confusion in interviews

---

Real-World Use Cases

• Shopping cart total
• Marks calculation
• Financial reports
• Data aggregation

---

Interview Tip

If asked:

“How does reduce work?”

Answer:

“It iterates over each element, updates an accumulator value, and finally returns a single result.”

---

Related Articles (Internal Linking)

👉 You can also check:

• TypeError: Reduce of Empty Array with No Initial Value (Fix Explained)

---

Final Summary

• reduce() converts array → single value
• acc stores result
• curr is current element
• Always use initial value (0)
• Helps in writing clean and efficient code

---

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