JavaScript
Reducing with reduce
Learn to reduce an array to a single value and the accumulator idea.
Reducing with reduce
reduce shrinks the array to a single value. At each step it receives an accumulator and the current element; the callback returns the new accumulator. Whatever is left at the end is the result.
It is handy for sums, products, maximums or merging objects. You pass the starting value as the second argument; if you omit it, the first element becomes the start. Calling reduce on an empty array without a start value throws.
What is the accumulator?
The accumulator is the 'so far collected' value carried through reduce. At each step the callback combines the accumulator with the current element and produces the next accumulator.
If you give a start value, the accumulator begins as that value. If you skip it, the first element becomes the accumulator and the second becomes the current element; the first step is then skipped. Knowing this prevents bugs.
Exercise Compute the cart total
Sum all prices in the cart array into a variable total. Use 0 as the start value. Print the result.
Show example solution
const cart = [120, 80, 200];
// sum the prices
const total = cart.reduce((acc, price) => acc + price, 0);
console.log(total);
Exercise Find the largest number with reduce
Find the largest number in nums using reduce and Math.max. Store it as biggest and print it.
Show example solution
const nums = [4, 9, 2, 7];
// find the largest number
const biggest = nums.reduce((acc, n) => Math.max(acc, n));
console.log(biggest);
Test yourself
-
What is the result of const sum = [1,2,3].reduce((acc, n) => acc + n, 0);?
const sum = [1, 2, 3].reduce((acc, n) => acc + n, 0);
Show answer
6 — Correct. 0 + 1 + 2 + 3 = 6.
-
compute the array's sum
const nums = [10, 20, 30];
const total = nums.reduce((acc, n) => ____, 0);
console.log(total);
Show answer
const nums = [10, 20, 30];
const total = nums.reduce((acc, n) => acc + n, 0);
console.log(total);
-
Match each reduce usage to its goal
- acc + n, 0
- sum of array
- acc * n, 1
- product of array
- Math.max(acc, n)
- largest element
- acc + n.length, 0
- total length
Next lesson: Summary - Array transformations
