JAVASCRIPT REDUCE METHOD EXPLAINED

Return to site

JAVASCRIPT REDUCE METHOD EXPLAINED

reduce method in JavaScript is used to reduce the array to a single value.

It takes a callback function which takes four parameters (accumulator, currentValue, index, array), but mostly we use the first two.

Examples

🧵👇

𝟏. 𝐂𝐚𝐥𝐜𝐮𝐥𝐚𝐭𝐞 𝐬𝐮𝐦 𝐨𝐟 𝐚𝐥𝐥 𝐭𝐡𝐞 𝐞𝐥𝐞𝐦𝐞𝐧𝐭𝐬 𝐢𝐧 𝐚𝐧 𝐚𝐫𝐫𝐚𝐲

const arr = [2, 3, 5, 4]; 
const arraySum = arr.reduce((sum, item) => sum + item, 0) 
console.log('Output is: ', arraySum); //𝑂𝑢𝑡𝑝𝑢𝑡 𝑖𝑠: 14

𝟐. 𝐂𝐚𝐥𝐜𝐮𝐥𝐚𝐭𝐞 𝐭𝐨𝐭𝐚𝐥 𝐧𝐮𝐦𝐛𝐞𝐫 𝐨𝐟 𝐟𝐫𝐮𝐢𝐭𝐬 𝐢𝐧 𝐭𝐡𝐞 𝐚𝐫𝐫𝐚𝐲

const fruits = [ 
 { name: 'Apple', qty: 3 },
 { name: 'Banana', qty: 4 },
 { name: 'Mango', qty: 2 }, 
]; 
const totalFruits = fruits.reduce((total, fruit) => total + fruit.qty, 0);
console.log('Total Fruits are: ', totalFruits); //𝑇𝑜𝑡𝑎𝑙 𝐹𝑟𝑢𝑖𝑡𝑠 𝑎𝑟𝑒: 9

𝟑. 𝐆𝐫𝐨𝐮𝐩 𝐬𝐭𝐮𝐝𝐞𝐧𝐭𝐬 𝐛𝐲 𝐜𝐥𝐚𝐬𝐬𝐧𝐚𝐦𝐞

const students = [
  { name: 'Mack', class: 10 },
  { name: 'Bob', class: 2 },
  { name: 'Jonas', class: 10 },
  { name: 'Charles', class: 5 },
  ]; 
  const output = students.reduce((group, student)=> { 
   const _class = student.class; 
   if (group[_class] == null) { 
    group[_class] = []; 
   } 
   group[_class].push(student);
   return group;
  }, {}); 
  console.log('Students by class are: ', output); 
/*
Students by class are:  {
  '2': [ { name: 'Bob', class: 2 } ],
  '5': [ { name: 'Charles', class: 5 } ],
  '10': [ { name: 'Mack', class: 10 }, { name: 'Jonas', class: 10 } ]
}
*/