Functional-Light JavaScript, v3

Composition with Reduce

Kyle Simpson

Kyle Simpson

You Don't Know JS
Functional-Light JavaScript, v3

Check out a free preview of the full Functional-Light JavaScript, v3 course

The "Composition with Reduce" Lesson is part of the full, Functional-Light JavaScript, v3 course featured in this preview video. Here's what you'd learn in this lesson:

Kyle proves that reduction can be achieved using composition with the reduceRight function and displays an example.


Transcript from the "Composition with Reduce" Lesson

>> Kyle Simpson: I want us to talk about composition for just a moment. Remember our reduce function, there is another companion function called, reduce right. So reduce goes from left to right through an array, but reduce right goes from right to left. You might remember earlier in the course. Another thing that either went left to right, or right to left.

And that's not accidental, that's foreshadowing for this discussion. Remember, we talked about a compose two. We did look in our exercise at the general compose utility, but just think about composeTwo for a moment. Look at the shape of composeTwo, what shape does it have?
>> Kyle Simpson: It takes two inputs, and what does it produce?

>> Kyle Simpson: A single output, so what shape does that sound like?
>> Speaker 2: Reducer?
>> Kyle Simpson: Sound like a reducer to anyone? That's a reducer, that can be used as a reducer. What reduction does it do? It takes two functions, and it reduces them through, what do we see on line 7, what is line 7 doing?

>> Speaker 3: Going over the function.
>> Kyle Simpson: Look at specifically line 7, what is line 7 doing?
>> Speaker 3: Returning a function.
>> Kyle Simpson: It's not, that's line 6 what is line 7 doing?
>> Kyle Simpson: What is it called when one function gets called, and its output gets past to another function call?

>> Speaker 4: Composition
>> Kyle Simpson: Composition, that's a composition. When fn1 is called with a value, and its output is immediately passed to another function, and that's called a composition. So the way that we are reducing those two functions, is through composition. That's a valid way of composing, and what I want you to think about when you think about reducing, reducing is a valid implementation of composition.

If I asked write me a general compose now, instead of writing a for loop and keeping track of stuff now you should be able to pull out ah-ha, I can just use a reduce write. We need to use reduce write, because composition goes right to left. If I said write me a pipe, you could pull out the .reduce, and reduce through the using composeTwo as your composer.

So here's what that looks like. We are doing reduce with the compose Two, but we can actually implement compose with reduce right. Here I'm calling the list of functions FN's line 3, I'm calling reduce right, and the reducer that I'm using I've named here invoke just [be]cause I couldn't come up with a better name for it.

What it does, is it takes two values of function and a value and it reduces that function and value through invocation. If you were to describe what is the composition, I mean what is the reduction that is happening? Line 4, is taking a function and a value, and reducing them through invocation, which is to say passing the value to the function, and then returning that result.

So our reduction is an indication, and that's how we can implement a compose across a list of functions as a reduction, as a right reduction basically. Line 9 we make f which is compose of div3, null2, add1. F of 8 gives a 6, because 8 plus 1 multiplied by 2 becomes 18, divided by 3 becomes 6.

>> Kyle Simpson: As some homework, I want you to write a pipe function for yourself, and use the regular reduce utility, okay?

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