filter, map, & reduce Solution: map

[00:00:00]
>> Now let's talk about Map. So in this one, I asked you all to actually implement your own map function using some of these helpers that we talked about. So those are defined here. And some of these especially like head and tail, those terms they might be a little bit new if you haven't worked with other languages than JavaScript for example, functional languages like Clojure maybe, which often use these terms, head and tail for arrays.

[00:00:35]
They're not super native terms to JavaScript. But we're trying to use them because again the nomenclature for a lot of these functions in the functional programming world might be something that is part of what that learning journey is. Is like grasping that head is equivalent to first element in an array.

[00:00:55]
So that's why we're using some of those more kind of traditional functional programming terms here. Okay, so how is this map exercise? Were we able to figure out a way to implement map without calling array.map? So what we have here is in my solution, I have a recursive implementation that has a base case of if my array is empty, I'm done.

[00:01:21]
I return an empty array. I might also have another base case here of like, for example, if there's exactly one element in my array, I return an array with the function applied to that element, as well. And then otherwise, I'm going to return this recursive application. And again we might want to have like a function of concat instead of this concat method, but array dot.concat returns a new array with the two arrays mushed together, concatenated into a single array.

[00:01:55]
So it's not going to change the original array, it's going to give me a new one. So that seems okay for our pure functional restrictions here. So what I'm gonna do is I'm gonna take the first thing out of the array, the head of the array. I'm gonna apply the function to it and get a little array started with that.

[00:02:15]
And then concatenate whatever the array is that comes back when I recursively apply map with that same function to the rest of the items in the array which in functional land is often called the tail of the array. And be careful because tail does not mean the last element of the array.

[00:02:38]
Which you might easily think because head is the first element, tail is a little different. So if head is a single value, tail is the whole rest of the array except for the head.
>> [INAUDIBLE] The bottom you used a double map. And then you pass an argument into it and so if you look at all the examples that I have seen is that it really say objects or array.map or array.filter.

[00:03:10]
And so how come just like that, you got a consonant and then you assigned it to the map without using an array and things like that. How does that work?
>> Right, so I'm understanding the question right is how is this different from doing wholes.map with whatever the function is that I want to pass in, and why am I doing it this way, instead of this way?

[00:03:36]
And so again, this is really just to build up our muscle memory, build up our habit of using a functional API where everything is functions. And we're not thinking about objects and their methods as ways of manipulating them. We're thinking about functions and what inputs they need. So in functional programming languages like Clojure, for example, the API for working with these things is often a lot more like what you see on the left here, where everything is functions and we pass in whatever arrays we're operating on.

[00:04:18]
And so that's why we're trying to get in the habit of converting our regular JavaScript object oriented dot method calling style to this more functional style where everything is an argument to a function. That said, the result of this in JavaScript is not gonna be different unless we've bungled our map implementation.

[00:04:47]
And so this is totally fine and if you prefer to work in that object-oriented style, go for it. I think that it's really useful to get in the habit of using this functional style mostly because it forces us to think about the functions before we think about the objects, if you know what I mean.

[00:05:06]
And again, so it's about that mind shift. Sorry.
>> Yeah, I do understand. So usually when I use that object or in orientated method [INAUDIBLE] style. So [INAUDIBLE] I've seen what to do and I've seen that one. The way you use that array.marvel, array.filter. Well, yeah, I will try it out.

[00:05:32]
Yeah, thank you.
>> Yeah, super great point. And again, this is totally valid JavaScript and it's deterministic, it's not gonna change things as long as wholes doesn't change, which again, everything is mutable in JavaScript, so there's no guarantees there. But again, this is really just about changing our mindset.

[00:05:54]
Getting into a new programming paradigm is really about changing the way you look at the world of the program. And so the reason we're focusing on these functions is really to force us to think about the world in terms of functions instead of thinking about it in terms of objects.

[00:06:10]
Okay, great questions. And so hopefully these doubled and halved applications were pretty straightforward. But just again, to give you an idea of what kind of functions you can pass in then to these map functions. The challenge exercise if anybody got to it was to figure out what function you would have to pass to map to get an array that is essentially this game Fizz Buzz.

[00:06:40]
If you haven't run into it before, there's a Wikipedia link, you can read about it. But essentially the rules are, if a number is divisible by three, you replace it with fizz. If a number is divisible by five, you replace it with buzz. If it's divisible by both three and five, it's fizz buzz.

[00:06:55]
So what we have here is kind of a series of little checks which figure out whether or not is divisible by three or five. And then figure out which strings fizz or buzz, we need to replace the number with and then optionally putting them together if they are necessary, and otherwise just returning the plain old number.

[00:07:18]
So that's one way you could solve this exercise again, there might be other really great solutions that would also solve this and produce the fizz buzz array we're looking for. But just a little mind bender there to see how we can use map to play games too.