This course has been updated! We now recommend you take the JavaScript: From First Steps to Professional course.

Check out a free preview of the full JavaScript: From Fundamentals to Functional JS, v2 course:
The "Passing Arguments, Part 2" Lesson is part of the full, JavaScript: From Fundamentals to Functional JS, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Bianca discusses how to pass a function with arguments to another function.

Get Unlimited Access Now

Transcript from the "Passing Arguments, Part 2" Lesson

[00:00:00]
>> Bianca Gandolfo: So we talked about passing a function to a function and then calling it. What about passing a function to a function, and then calling it with arguments? How might we do that? Who has an idea?
>> Bianca Gandolfo: So, if we were to pass arguments, where would we do that?

[00:00:27]
>> Speaker 2: So you could pass the arguments in along with the function as parameters, and then in the body of that function. You could pass those parameters for that function into the function and call it.
>> Bianca Gandolfo: Yep, so something like this, maybe.
>> Bianca Gandolfo: Let's just do p.
>> Bianca Gandolfo: All right, so imagining that this function required something to be passed to it.

[00:01:01] You can pass it as an argument, so we're calling if else.
>> Bianca Gandolfo: Where is it? Okay, I'll just write it up. For calling if else,
>> Bianca Gandolfo: With the true and then this function, fn 1, fn 2, and then HI. Just like that, condition will be true, isTrue is this first function that we hadn't defined we'll just imagine that it exists and then we'll pass it with p, p is HI.

[00:01:48]
>> Bianca Gandolfo: So that's how you would do it. Maybe it seems straightforward after someone tells you, but sometimes that's tricky. Any questions about this? Do you have a question, Abdi?
>> Abdi: Yeah, so is HI in parenthesis, a p?
>> Bianca Gandolfo: Yeah, so one, two, three, four, one, two, three, four.

[00:02:13] So they're lined up in order.
>> Bianca Gandolfo: Okay? Awesome, so we also have this rest operator. And,
>> Bianca Gandolfo: We,
>> Bianca Gandolfo: Can do a cool thing. So if we wanna pass multiple, we can then, let me copy what we had before.
>> Bianca Gandolfo: If we had multiple,
>> Bianca Gandolfo: Oops, so now args, if we just console.logged it it's gonna look like an array.

[00:03:05] It's gonna have these things, and then,
>> Bianca Gandolfo: This is not being kind to me today. There we go.
>> Bianca Gandolfo: This is what args looks like.
>> Bianca Gandolfo: Okay, you guys saw it. So that's what args looks like. And then if we do the same thing and we pass it with the dots.

[00:03:46] It's the same as saying,
>> Bianca Gandolfo: Calling it one at a time. So it takes out of the array, and passes it, as you would normally. So this is really similar to something, I'm not about to give you the answer cuz I'm asking you. How is this done before ES6?

[00:04:27]
>> Speaker 2: How is passing each of them one at a time done?
>> Bianca Gandolfo: Yeah, and just figuring out how to get the rest of the arguments.
>> Speaker 4: You'd have to call the arguments object and then you can [CROSSTALK] to an array.
>> Bianca Gandolfo: Yep, you have to figure out the arguments object and then if you wanted to pass it one at a time, as an array or as part of the arguments objects, you would use apply.

[00:04:53] So apply is a function method that is, I pretty much exclusively used for this purpose, which is to call functions with the arguments keyword. And, if you're not familiar with it, it's something worth looking into. Call, apply and bind are some core methods that I would love to be able to sneak into this class but I didn't even begin to think it was reasonable before I started planning it but it's something to look into.

[00:05:24] No, I don't have, never mind. Not on Frontend Masters. Yeah, so before ES6, we had to do something like this, where we'd slice it up. We wanna slice the first three off, because we already know what those are and then we wanna just pass the rest.
>> Speaker 2: If you wanted to, could you slice out, say, those first three, and then the first term of that sort of arguments list?

[00:06:02] So if you did arguments for, would it grab that first term and return the remaining arguments? Does that make sense?
>> Bianca Gandolfo: No, one more time.
>> Speaker 2: So, right here you're taking a slice, you're getting rid of the first three because we know what they are, and then you have the remaining arguments list.

[00:06:22] Could you, say, take those first three and the first term of that arguments list and then return just the remaining arguments off of that?
>> Bianca Gandolfo: Take the first three-
>> Speaker 2: Yeah, so the first three that we already know are there. So you have the first three, and then you have that remaining arguments list.

[00:06:42]
>> Bianca Gandolfo: So you want to unshift the array, or shift the array?
>> Speaker 2: Well, just cut into that arguments list. So maybe take the first term off of that arguments list, and then just return the remaining arguments off of that list. So it would be four in this case instead of three.

[00:06:57] And then, I don't know if it would work, but possibly then take off the first term of-.
>> Bianca Gandolfo: The first term.
>> Speaker 2: The first element of that arguments list.
>> Bianca Gandolfo: I think you lost me because this is slicing the first three and it's returning the rest. So args is anything after this.

[00:07:29]
>> Speaker 2: Right, right, yeah, there's no real difference between those first three and then the remaining list, in the arguments list. I was just confused about something else.
>> Bianca Gandolfo: No worries.
>> Bianca Gandolfo: So then you can put whatever you want here.