Four Semesters of Computer Science in 5 Hours Map Function

[00:00:00]
>> [MUSIC]

[00:00:04]
>> Brian: We're going to talk about map, and this is a different map, unfortunately. This is map in the sense of forEach instead of map in the sense of a data structure, so map is in the function. And all bitmap does is it takes in an array like we have right here.

[00:00:19] It applies some function to each individual element in that array and returns something. So in this particular, I'm gonna do array.map and then this function is going to get applied to every single item in that array. And the thing that this function returns is going to be put into a new array and given back to you.

[00:00:40] So in this particular case, I apply map, right, and I'm just adding 1 to every number so I get back an array of 2,3,4,5,6, right, because it transformed every single element in that array. So let's take a look at what that looks like in practice. These are definitely ones I would suggest you go back and do, cuz I promise this is gonna make you a better programmer, okay?

[00:01:05] So we have four different tests here. Let's just actually go down and see how they're implemented. So if we're going to do doubleEach, if we had an array of values and we wanted to double everything in it, what would that look like? We have this method, double, which just takes a number and returns a double.

[00:01:29] Again, this is ES6, you can do that if that makes more sense to you. But if you leave off the curly braces, there's an implied return which is exactly what that is. So basically it says number and then it just returns a doubled version of that. And then if you wanted to doubleEach something, basically we're going to take an input which is going to be an array of a bunch of numbers, we're gonna call map and everything in that array is going to get doubled, right.

[00:01:57] So if we go down here to look at the unit test, the numbers that we get back are 5. So we're doing 10, 1000, right. 3 gets doubled to 6, etc., etc., right? So that's what test one is doing here. Same idea with square. So we have a function here that squares something, so it's just something times itself, right?

[00:02:21] And then we're applying that square method or function to everything inside of this input array, right? So again going down here, this is 100, this is 1. 9 gets squared to 81, 2 gets squared to 4, right. That's the basic idea here. Now that in and of itself is not very compelling, but once you start chaining them together, it actually gets pretty cool, right?

[00:02:47] So now that I've already made double and I've already made square. I can do double and square each, so now I do input.map double.map square. So now I have these two, I didn't have to write any more code, right? I'm just reapplying the building blocks that I already built.

[00:03:05] So I'm just applying map twice here to double and square something.
>> Brian: I think it's pretty cool. And now we can just test the hell out of double and square and we can just make sure that those building blocks are just rock solid, right. And that's all that that mapping is doing is just applying these transformations to all these different numbers or whatever you have in an array.

[00:03:31] So any questions about that?
>> Brian: Cool, your mind just might be melted at this point so I wouldn't blame you. But if you wanna see, this is actually all map is. This is all that's happened. Well, that's not totally true. There's other things, but this is essentially what map is.

[00:03:50] For all intents and purposes, this is what map is. So you have an array, we loop over the array and we just apply that function and push into array and give it back to you. That's it, that's the end of it. So as you can see, I come down here do the divide by 2 and I just do myMap, and that actually ends up being what it does.