Functional JavaScript First Steps

filter, map, & reduce Solution: reduce

Anjana Vakil

Anjana Vakil

Software Engineer & Educator
Functional JavaScript First Steps

Check out a free preview of the full Functional JavaScript First Steps course

The "filter, map, & reduce Solution: reduce" Lesson is part of the full, Functional JavaScript First Steps course featured in this preview video. Here's what you'd learn in this lesson:

Anjana demonstrates the solution to the filter, map & reduce exercise. This segment covers implementing the sum and max reducer functions.


Transcript from the "filter, map, & reduce Solution: reduce" Lesson

>> Okay, how about reduce? So again I find reduce the oddest one of these and the one that took me the longest to kind of wrap my head around. So there's an implementation here which you can kind of study and reference. Again, it's a recursive implementation, we're gonna get really used to this.

[LAUGH] [COUGH] Excuse me, we're gonna get really used to those recursive implementations in functional programming. And the question is what can we pass in as these reducer functions to get in the habit of thinking about, okay, we've got an accumulator and each successive value coming in. How do we combine those to merge all of those values, reduce them into a single output value?

So for example, the sum operation, we can give a pretty simple reducer function that takes the accumulator and the value, and returns their sum. And then with all of these reduce applications, we're using an initial value, to kind of kick off the reduction operation. In this case, in the case of sum, kind of makes sense to start from 0, and then we can add things on from there.

So 0 is gonna be kind of our initial starting accumulator, and from there we're going to add on by using this reducer function that we implemented. We're going to add on each of the other values in our array through this recursive operation. Questions there? Okay, and similarly we could define like a max reducer where the reducer function is going to take the accumulator and the value, and then figure out whether the value is higher than the accumulator.

And if it is, it's gonna replace that accumulator with the value. So that's gonna become the accumulator in the next call to the function. And otherwise if value is smaller, it's gonna keep the old accumulator. So essentially, we keep checking values. We start with 0, and we say okay, is our first value and I put these out of order just so it would be a little bit less trivial of how this is working.

We say okay, 7 greater than 0, yes. Okay, 7 is our new accumulator, next recursive call. Okay, 7 is the accumulator, 1 is the value. Is 1 greater than 7? No, okay, 7 is still a accumulator, then 3, and then 5, and so on and so forth. So reduce is one of these functions that for me is like a real mind bender, especially when we think about the types of reducer functions that we need to write to get the results that we want.

But once we get in the habit, and this is why we're doing these exercises, practice makes perfect. Once we get in the habit of thinking about accumulators as this way to remember where we are in the operation. That allows us to kind of think about things in this recursive functional way instead of using things like let's say an array or current a max value that we're using in a for loop that we're updating over time.

So this accumulator is essentially what allows us to remember the values that in a non-functional program we would be using state. We would be using state fullness to remember where we're at in our operation. Why do we need map and filter? Because can't you reduce any data structure into another data structure?

Well, in some cases the way you wanna conceive of the problem that you're trying to solve, the program that you're trying to write. Is maybe that you want to think about it in terms of, if we think about back to our sandwich here, you wanna think about it in terms of kind of transforming each element in an array individually, kind of one at a time, independent of each other.

And those are great cases for a map. Or again if we want to throw out some elements in an array, filter makes it really quick and easy to do that if all I need to know is a certain test for each element, that predicate function. Reduce comes in a lot handier when what we really want as output is a single value instead of a sequence of values.

So you could write something kind of like a map by reducing an array to another array. But it would require jumping through a couple of conceptual hurdles that there's not really a necessity to put yourself through when we also have helper functions that are exactly designed for transforming all the elements of one array, excuse me, for transforming one array into another by doing an operation on each element.

So it's a question of trying to find a technique that's a really good mental match, like a mental model. That's a good match for the problem in terms of what inputs you have and what output you want.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now