This course has been updated! We now recommend you take the JavaScript: From First Steps to Professional course.
Transcript from the "Looping with _.map()" Lesson
[00:00:00]
>> [MUSIC]
[00:00:04]
>> Bianca Gandolfo: Cool, so knowing what we know now about map. Maybe it makes more sense instead of using each, to rewrite this using map. So that's our next step and I'll give you about five minutes to get started with. Transiting each function into the map function, that saves all of our animal objects into our farm.
[00:00:33]
>> Bianca Gandolfo: All right, so what's the first thing that we need to do here?
>> Bianca Gandolfo: Maybe do _.map. What are we gonna map over, do you known John?
>> Speaker 2: The animal names.
>> Bianca Gandolfo: Mm-hm. No, I ran out of animal names.
>> Bianca Gandolfo: So we're mapping over the animal names.
>> Bianca Gandolfo: What function do we want to put here?
[00:01:24]
>> Bianca Gandolfo: What was it?
>> [SOUND]
>> Bianca Gandolfo: No, this is speak. No we definitely want to call AnimalMaker somewhere.
>> Speaker 3: [INAUDIBLE]
>> Bianca Gandolfo: Hmm?
>> Speaker 3: If you just pass in AnimalMaker, map is gonna call it with the name.
>> Bianca Gandolfo: That's true. Let's do it out the long way and then we'll all clean it up.
[00:01:57]
>> Bianca Gandolfo: So we're passing, what's being passed here?
>> Speaker 4: Name of the animal.
>> Bianca Gandolfo: And then what did we want to do next?
>> Speaker 4: Call AnimalMaker with that name.
>> Bianca Gandolfo: Yep, absolutely, name.
>> Bianca Gandolfo: And then what else? There's a couple, small, minor things that we need to do.
>> Speaker 5: Well, we gotta put in the farm.
[00:02:24]
>> Bianca Gandolfo: Yeah.
>> Speaker 5: Which you can do farm =
>> Bianca Gandolfo: Mm-hm.
>> Bianca Gandolfo: And one last but very, very important thing.
>> Speaker 6: Return.
>> Bianca Gandolfo: Yep, we need to return it.
>> Bianca Gandolfo: Awesome. So now we see we've kind of condensed a line or so. We have our animal names. We're passing each name, and we're returning it.
[00:02:59] And now we don't have to do this extra operation which is pushing it to the farm. It just happens automatically, which is awesome. And and as John mentioned, we can even go a step further and not even have this function and we could just put AnimalMaker directly here.
[00:03:21] Then it will just call it with the name as the first parameter. So in fact we can just leave it like that. And that's even shorter. And then we can see, if you understand the mechanics of how an app works, you know already that we're using animalNames and you're making an animal with each animal name.
[00:03:44] So that even makes it more clear to yourself and you're looking back at the code, and you're like, what does this code do again, I forgot. Or your colleagues are going to pick up code after you. And that's super common, everyone pretty much uses it and should understand it.
[00:04:01] Mm-hm.
>> Speaker 2: So I'm confused by what the return value AnimalMaker is, it's an object, right? But what?
>> Speaker 2: I guess I'm confused how this is working.
>> Bianca Gandolfo: Sure, so whatever this function returns is gonna be stored as an array, and then we're gonna store that array, it's gonna be farm.
[00:04:25] So map here is going to return an array of whatever the callback function returns. So our callback function is AnimalMaker. So for the first loop, the first iteration with Sallie, we're going to call AnimalMaker. We're going to pass the value, right? The value is Sallie, so that's the name to the AnimalMaker.
[00:04:45] We enter into this function body and we turning an object with one property on it. That's the property called speak and which is a function that all does is console.log my name is, and it said it's name. But, we're not, we're not calling speak right? No, you're not calling speaker, you're calling AnimalMaker and it's returning this.
[00:05:10]
>> Speaker 7: We're not doing anything with the animals once they get back into the farm array.
>> Bianca Gandolfo: Not yet.
>> Speaker 7: So that's why I think we're kind of struggling with.
>> Bianca Gandolfo: Yep.
>> Speaker 7: The name of the function is AnimalMaker, yet it's really making
>> Bianca Gandolfo: It's making animal objects.
>> Speaker 6: So it's storing the animal objects in the array?
[00:05:25]
>> Bianca Gandolfo: Mm-hm, and we're giving our animals the ability to speak. So if we never use this function, we'd all have just really quiet animals.
>> Speaker 7: [INAUDIBLE]
>> Bianca Gandolfo: Which might be better, I don't know.
>> Speaker 2: [LAUGH] Now if you did access, let's say the first index of the farm, list, it'll basically spit out in the console, hi my name is whatever that first tally or whatever.
[00:05:48]
>> Bianca Gandolfo: Mm-hm. Mm-hm. So we can just go ahead and delete this. And we can run this code and we can kind of look at it. And so it's important, wherever you're running this code, that you have the underscore library included. Because it's a library, if you just run it on any site.
[00:06:05] These methods aren't available but luckily we know for sure that the underscore library site has underscore on it. That'd be funny if it didn't, but. And so let's check out our farm. So we see our farm is three different objects with the speak function on it. And then if we wanted someone in our farm to speak what we could do is we could say the first one.speak and it says my name is Sally and then we could try the next one and it will say their name.
[00:06:44] Like that. And we can investigate, let's just an object with one property, speak. Is that clear?
>> Bianca Gandolfo: And for those on chat who are asking about the explicit return, we are explicitly returning something here. And then also inside of the map _map function.It's also returning in there, so