JavaScript Array reduce() Method: Streamlining Your Array Operations

2 min read


The reduce() array method in JavaScript is a powerful tool for iterating through array elements and performing operations on them. It simplifies the code and produces efficient, optimized results.

You can use it to convert an array into a single value, known as the "accumulator". The reduce() array method iterates through the elements of the array and runs a give "reducer" function on each element of the array. During each iteration, the reducer function updates the accumulator, which is returned at the end of the method.

In addition to the reducer function, you can also pass an initial value to the accumulator. This allows you to tailor the output according to your specific use case.

Using reduce()

The reduce() method accepts two arguments:

  • a reducer function
  • an initial value (optional)
const arr = [1, 2, 3]
arr.reduce((acc, item) => {
  // do something with the accumulator
  // ...
  return acc
}, initialValue)

The reducer function receives two arguments:

  • current value of the accumulator
  • the current array item

And it returns the updated value of the accumulator. For the first iteration, the value of acc will be the same as initialValue.

const arr = [1, 2, 3]
const value = arr.reduce((acc, item) => {
  return acc
}, 0)
console.log(value) // 0

If the initial value is not provided in the reduce() method, then the first element of the array is used as the initial value of the accumulator and the iteration starts from the second element of the array.

const arr = [1, 2, 3]
const value = arr.reduce((acc, item) => {
  return acc
console.log(value) // 1


Let us see some examples of reduce():

1. Sum of elements of an array

const arr = [1, 2, 3, 4, 5]

const arrSum = arr.reduce((acc, item) => acc + item, 0)
console.log(arrSum) // 15

2. Product of elements of an array

const arr = [1, 2, 3, 4, 5]

const arrProd = arr.reduce((acc, item) => acc * item, 1)
console.log(arrProd) // 120

3. Joining the elements of an array separated by comma

const arr = ['a', 'b', 'c', 'd']

const list = arr.reduce((acc, item) => `${acc}${item},`, '')
console.log(list) // a,b,c,d,

Table of Contents

Recent Articles

Contenteditable HTML: A Guide to Interactive Web Content

Have you ever come across web pages where you can edit the content? Perhaps you've seen websites like Pinterest, where simply clicking on a heading tag transforms it into an editable input field: Image 1 Image 2 These interactive elements allow users…

Read more