Array.prototype.reduce, most versatile array method in javascript

Arrays are an essential data structure in JavaScript that provide developers with a flexible and efficient way of storing and manipulating collections of data. Among the many methods available for manipulating arrays in JavaScript, the reduce() method stands out as one of the most versatile.

The reduce() method is a built-in method in JavaScript arrays that reduces an array to a single value. This method takes two arguments, a callback function and an initial value. The callback function is executed on each element of the array and accumulates the result to the next iteration until it returns a single value. The initial value is the starting value for the accumulation process.

The callback function passed to reduce() method takes four arguments, the accumulator, the current value, the current index, and the array are processed. The accumulator is the accumulated value from the previous iteration or the initial value if it is the first iteration. The current value is the value of the current element being processed. The current index is the index of the current element being processed. Finally, the array being processed is the original array.

The reduce() method is a powerful tool for manipulating arrays in JavaScript. It can be used for a wide range of tasks, including summing the values of an array, finding the minimum or maximum value in an array, counting the number of occurrences of an element in an array, and much more.

One of the most common use cases of the reduce() method is to sum the values of an array. For example

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);
console.log(sum); // Output: 15

5 Real Life Examples of Array Reduce in JavaScript

Most of the time when we discuss reduce() method we normally share a sum of the array or summation of the array of object values. Today I will share with you 5 real-life and exceptional reduce() method use cases that we do not see often.

1. Calculating the average value of an array of numbers :

const numbers = [10, 20, 30, 40, 50];
const average = numbers.reduce((accumulator, currentValue, index, array) => {
  accumulator += currentValue;
  if (index === array.length - 1) {
    return accumulator / array.length;
  } else {
    return accumulator;
  }
}, 0);
console.log(average); // Output: 30

1. Flattening an array of nested arrays :

const nestedArray = [[1, 2], [3, 4], [5, 6]];
const flattenedArray = nestedArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []);
console.log(flattenedArray); // Output: [1, 2, 3, 4, 5, 6]

1. Counting the occurrences of words in an array of strings :

const words = ['apple', 'banana', 'apple', 'orange', 'banana', 'banana'];
const count = words.reduce((accumulator, currentValue) => {
  if (currentValue in accumulator) {
    accumulator[currentValue]++;
  } else {
    accumulator[currentValue] = 1;
  }
  return accumulator;
}, {});
console.log(count); // Output: { apple: 2, banana: 3, orange: 1 }

1. Removing duplicates from an array :

const numbers = [1, 2, 3, 2, 4, 3, 5];
const uniqueNumbers = numbers.reduce((accumulator, currentValue) => {
  if (!accumulator.includes(currentValue)) {
    accumulator.push(currentValue);
  }
  return accumulator;
}, []);
console.log(uniqueNumbers); // Output: [1, 2, 3, 4, 5]

1. Grouping an array of objects by a property :

const students = [
  { name: 'Alice', grade: 'A' },
  { name: 'Bob', grade: 'B' },
  { name: 'Charlie', grade: 'A' },
  { name: 'David', grade: 'C' },
  { name: 'Emma', grade: 'B' },
  { name: 'Frank', grade: 'A' },
];
const groupedStudents = students.reduce((accumulator, currentValue)
  if (!accumulator[currentValue.grade]) {
    accumulator[currentValue.grade] = [];
  }
  accumulator[currentValue.grade].push(currentValue.name);
  return accumulator;
}, {});
console.log(groupedStudents); // Output: { A: [ 'Alice', 'Charlie', 'Frank' ], B: [ 'Bob', 'Emma' ], C: [ 'David' ] }