Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Some examples about reduce() in Javascript
//Example 1 - Calculate average value of an array (transform array into a single number)
var scores = [89, 76, 47, 95]
var initialValue = 0
var reducer = function (accumulator, item) {
return accumulator + item
}
var total = scores.reduce(reducer, initialValue)
var average = total / scores.length
/*Explain about function
You'll notice .reduce takes in two values, a callback function and an initial value.
The very first time the reducer function is called, it's going to be passed the initialValue you gave it
(the 2nd argument to .reduce) and the first item in the actual array. So in our example above the first time
that our reducer function runs, accumulator is going to be 0 and item is going to be 89. Remember, the goal
is to transform an array into a single value. We currently have two numbers, 0 and 89, and are goal is to get
that to one value. Because we're wanting to find the sum of every item in the array, we'll add 89 + 0 to get 89.
That brings up a very important step. The thing that gets returned from the reducer function will then be passed
as the accumulator the next time the function runs. So when reducer runs again, accumulator will be 89 and item
will now be the second item in the array, 76. This pattern continues until we have no more items in the array
and we get the summation of all of our reducer functions, which is 307.
*/
// =====================
// EXAMPLE 5 - Calculate average
function average(arr){
return arr.reduce((a,b)=>a+b)/arr.length
}
console.log(average([1,2,3,4,5])); //output: 3
// =====================
// EXAMPLE 5 - Count something
var arr=[1,2,3,4,5];
//count odd number:
console.log(arr.reduce((a,b) => a+(b%2?1:0),0)); //output: 3
//count even number:
console.log(arr.reduce((a,b) => a+(b%2?0:1),0)); //output: 2
// =====================
//EXAMPLE 2 - Transform array to an object
var votes = [
'tacos',
'pizza',
'pizza',
'tacos',
'fries',
'ice cream',
'ice cream',
'pizza'
]
var initialValue = {}
var reducer = function(tally, vote) {
if (!tally[vote]) {
tally[vote] = 1;
} else {
tally[vote] = tally[vote] + 1;
}
return tally;
}
var result = votes.reduce(reducer, initialValue) // {tacos: 2, pizza: 3, fries: 1, ice cream: 2}
// And vice versa (object to array)
var maxSpeed = {
car:300,
bike:60,
motorbike:200
}
var arr = [];
for (var vehicle in maxSpeed)
arr.push([vehicle, maxSpeed[vehicle]]) //Output: [["bike", 60], ["motorbike", 200], ["car", 300]]
)
// =======END===========
// =====================
// EXAMPLE 3 - Counting the occurrences
//3.1 Of JavaScript array number elements
var newArr = [1,1,3,4,3,2,2]
var countObj = newArr.reduce(function (acc, curr) {
if (typeof acc[curr] == 'undefined') {
acc[curr] = 1;
} else {
acc[curr] += 1;
}
return acc;
}, {});
//3.2. Count objects that have a specific property:
people = [
{name: 'Mary', gender: 'girl'},
{name: 'Paul', gender: 'boy'},
{name: 'John', gender: 'boy'},
{name: 'Lisa', gender: 'girl'},
{name: 'Bill', gender: 'boy'},
{name: 'Maklatura', gender: 'girl'}
]
var numBoys = people.reduce(function(n, person) {
return n + (person.gender == 'boy');
}, 0);
//3.3. A function for processing 3.1 & 3.2
var count = function(ary, classifier) {
return ary.reduce(function(counter, item) {
var p = (classifier || String)(item);
counter[p] = counter.hasOwnProperty(p) ? counter[p] + 1 : 1;
return counter;
}, {})
}
If you don't provide a classifier this simply counts different elements:
> count([1,2,2,2,3,1])
{
"1": 2,
"2": 3,
"3": 1
}
With a classifier you group elements by specific property:
> countByGender = count(people, function(item) { return item.gender })
{
"girl": 3,
"boy": 3
}
Greate ^^
// ======================
@DostyTheGreatKigali
Copy link

DostyTheGreatKigali commented Jun 20, 2019

Thanks a lot

@awillem
Copy link

awillem commented Nov 21, 2019

Great examples! Thanks for putting them together!

@joshuacoda
Copy link

joshuacoda commented Mar 20, 2020

This is very much appreciated.

@Thilak8654
Copy link

Thilak8654 commented Dec 14, 2020

Great examples. Thanks.
Could you please tell me how to group the array items based on the number passed using the reduce method or any other way?
For ex:

  1. x=3, arr = [1,2,3,4,5], I need the result to be [[1,2,3], [2,3,4],[3,4,5]]
  2. x=2, arr = [1,2,3,4,5], I need the result to be [[1,2],[2,3],[3,4],[4,5]]
    3 x=1, arr = [1,2,3,4,5], I need the result to be [[1],[2],[3],[4],[5]];

Thanks

@cforsyth68
Copy link

cforsyth68 commented Jun 6, 2021

Awesome. Thank you.

@Thomas-Basham
Copy link

Thomas-Basham commented Mar 21, 2022

Very nice!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment