Reduce basics - Part 3 of Functional Programming in JavaScript

hello in this series we are learning function appropriate JavaScript if you have not watched the two previous episodes you should do so first before watching this one can do so by clicking there ish in this episode we will learn about yet another higher-order function read dupes so why should you learn reduce for me learning about reduce was one of those no holy moments in programming I had heard about reduce I heard the word I kinda sorta thought it was something that you could doing databases no sequel databases and when I finally learned it oh my god I can use this everywhere then you do your interview should so what is reduce before we talk about that let's recap what we learned in previous videos we've learned about a couple of higher-order functions map filter and reject what all these have in common is that they transform a list into something else map will take an array and transform that into an array of the same length but with each individual item transform filter transforms an array into a smaller array we also briefly learned about reject which does the same thing as filter but inverted another example that I haven't mentioned is find which does the same thing as filter but only returns the first item so that transforms an array into a single item there are lots of array transformations like this on the array object but what to do if you can find one that fits that is where reduce comes in map filter reject and find are all list transformations they turn your list into something else but they are all pretty specific reduce is not reduce is the multi tool on list transformations it can be used to express any list transformation in fact you can use reject to implement functions like math further reject or find or any other list transformation reduce is the super list transformation that you can fall back on if you can't find a prebuilt list transformation that fits your problem and now we have done three minutes without code which means that you guys have died of boredom and I'm talking oh oh okay pause the video do some stretching oh my god it's cool have a look at this ring our mission is to summarize or the amounts I'm going to show you how to do this use reduce but first let me make a for loop let's have a look at this we create a variable called total amount and we loop through the orders and for every order here we take the amount and add it to total mom says console.log that out run it and it gives us this up its reimplemented s using reduce I will comment out the for loop so that it can compare them here we go so just like map or filter reduce is a function on the array object and just like math and filter it takes a callback function but unlike map and filter it wants an object you can think of this object as a starting point for our sum it's going to be zero and this sum is going to be passed as the first argument to the reduce code just like map and filter reduce will also receive the iterated item but it's going to be the second argument now what we going to do is that we're going to take the sum that we received the initial value and we're gonna add the order amount to it so this is going to be take the first order and add zero point and return and this return value will in turn be passed as the sum in the next situation which in turn will add its amount to it and return that and so on until we are finished so if we save and run it will give us the same amount as the for loop let me place a console dot log inside the reduce function hello where we echo out the Sun and the order that we're getting in and we run it the first situation we are receiving the first object in the array and we're also getting the starting value that we are passing in as a second argument to reduce we return a value here which will be zero plus 250 which will be passed on to the second iteration of reduce which we see here so the return value is passed in as a sum along with the second item in the array and we're adding on 400 to 250 and we're returning that to the next iteration of the loop which be what will be 650 and it will get the third item and so on until we have iterated all the items in the array and then the final return value will be returned and that will be our self let's compare this to the board will remove the consult long non-supportive doesn't happen also look long if we look at the for loop it is 97 characters if you look here down in the lower left corner and when I select the reduce function you'll see that it's 88 characters it is slightly shortened the difference is not quite as dramatic as between the for loop and map and filter when you can use those because they are very specific and very tailored to their job so you have to give reduce some slack because it's a lot more generic and to do a lot more work in I could talk about it can do any array transformation which we will look at later but reduce is still shorter than the the for-loop and especially remember that we talked about arrow functions new format for functions in ACMA script 6 and when you use those you'll see that it is a lot so in this video I talked about how reduce fits into your toolbox how math and filter and reject and find are all list transformations and how reject is the multi tool of list transformations which you can use if you can find a pre-built transformation that fits your purposes I've also showed you a super basic example of what you can use reduce for however the example that I showed you is extremely basic and really doesn't showcase the extreme power of this function so I want to spend the next episode on reduce as well talk about how reduce combines with other list transformations I want to talk about how reduce can create much more complex and interesting objects than just the sum that I showed you in the example I am going to sell you on how powerful this function is do not mess it follow me on twitter at MP Jamie or just simply subscribe by clicking there why can't I point correctly this is me doing post-production pointing there there there this subscription is there see you next Monday until then stay curious

Channel: Fun Fun Function

Views: 278,661

Rating: 4.9604025 out of 5

Keywords: JavaScript (Programming Language), Functional Programming (Programming Language Paradigm), Programming Language (Software Genre), Software Engineering (Industry), Software Developer (Project Role), Software (Industry), Software Development (Industry), Screencast (Software Genre), Tutorial (Media Genre)

Id: Wl98eZpkp-c

Length: 9min 39sec (579 seconds)

Published: Sun Jul 05 2015