Call and Apply

[00:00:00]
>> Will Sentance: Line one, what are we doing? What are we doing? Let's have, let's have, Susie, my friend, what are we doing?
>> Speaker 2: We're creating an object, we have a const.
>> Will Sentance: Fantastic, we're declaring a const, its name is? Your favorite.
>> Speaker 2: Obj.
>> Will Sentance: Obj, well named object. Obj which is yes, assigned an object, with what properties?

[00:00:31]
>> Speaker 2: The property of num and increment.
>> Will Sentance: Fantastic, num is 3, increment is a function, spot-on. Okay, next line, Susie, let's start with you.
>> Speaker 2: So now we have the other obj.
>> Will Sentance: Fantastic. What are it's properties?
>> Speaker 2: A property of num.
>> Will Sentance: Which is?
>> Speaker 2: A value of 10.

[00:00:52]
>> Will Sentance: 10, does it get an increment property? Increment method? No. That's a shame. Cuz I kinda wanted to use micro function on this object? What could I do? Let's see what his first try calling object increment taught me through the lookup process, Elliott, of orbs with the increment method call on it.

[00:01:12]
It's not that fancy, but told me through it. I look for orbit. Where in the global memory? I find it. Do I have an increment method on it? I do for once, [LAUGH] I was still using my answers no voice. So some of you might actually thought maybe it's not there but no it is indeed there, we execute it.

[00:01:30]
Let's execute it and let's do our, as our execution context there it is and into it we go. In the local memory, we have a no parameter argument combo, [INAUDIBLE] but we do have what?
>> Speaker 3: This.
>> Will Sentance: And this, excellent, an implicit parameter they call this. Implicit means something I didn't implicitly state, it's just there.

[00:02:00]
This which is assigned automatically to what, Seth?
>> Speaker 3: Obj.
>> Will Sentance: Obj, in other words, whatever is to the left-hand side of the dot on which that function is being called. So it's obj, so when we do this .num ++, we're really doing, obj x, and thank you, Seth, .num ++ us look for obj not there, look for obj num, perfect, there it is, four.

[00:02:25]
But damn I wanna use that increment function other obj. But I don't have an increment function on it, and I can't do, what can I do? Well it turns out there's a way of running a function other than putting parends on the end of its name. We're running a method or a function and putting parends on the end of its name, if we use call.

[00:02:54]
And then parsing is the first argument. Whatever we want the this inside of that function to refer to. No more it just automatically referring to the object left of the dot. No, no, no, no, that was, you know, we couldn't control that. No more even with the arrow functions, it referring this to whatever this was where the function was defined.

[00:03:17]
Which, in this case, would be global, a global object. Instead, we are gonna take control of what the this assignment's gonna be. We're gonna manually take control using call. By the way, any further arguments, we have to parse in, we'd put them as after call as further arguments.

[00:03:36]
The first one is gonna be out of this assignment. Any further ones will follow after. Okay, let's see that for real. So let's hit that final line of code here, let's have Nick give me the journey that's gonna happen on this line of code here.
>> Speaker 4: So obj, the obj object in

[00:03:57]
>> Will Sentance: The obj object, exactly.
>> Speaker 4: in The global memory is hit.
>> Will Sentance: Has an increment method on it.
>> Speaker 4: Yep.
>> Will Sentance: We're just gonna go and grab it dude. We're just gonna grab it okay?
>> Speaker 4: And then we're gonna grab call, but call isn't Not on increment.
>> Will Sentance: Yeah yeah yeah.

[00:04:14]
>> Speaker 4: So we're gonna go to the protomethod.
>> Will Sentance: Should we do that just to remind ourselves? It's a little bit over complicated but should we do it? Rather than to assume it's there, let's take that journey.
>> Speaker 4: Okay.
>> Will Sentance: Do you want to do that journey?
>> Speaker 4: Sure.

[00:04:22]
>> Will Sentance: My god okay hold on. So by definition even though I can't. I wasn't gonna do this but Nick you forced my hand.
>> Speaker 4: [LAUGH]
>> Will Sentance: By definition it's a function.
>> Speaker 4: By definition it's a function.
>> Will Sentance: Object combo. Even though it's on an object, it is a function object combo, it may be a method, it's a function object combo.

[00:04:39]
And on that object, believe it, it has what hidden property?
>> Speaker 4: Proto.
>> Will Sentance: Proto, fantastic. Which is a link to?
>> Speaker 4: Function.
>> Will Sentance: To almost, to function, because function is a Function object combo as well. Which has a property on its prototype, which is an object, and it's turned that object.

[00:05:05]
And that object has what on it?
>> Speaker 4: Call.
>> Will Sentance: Call, fantastic. There it is, very, very nice by Nick. Let's give Nick another hand, that was absolutely.
>> [APPLAUSE] [APPLAUSE]
>> Will Sentance: Yeah, I was not even gonna bring that up. We just know it's there, but that's where it is.

[00:05:21]
It's not some mystery, that's where it is, excellent Nick. And so we grab that function and we create an execution context for it. With a local memory. And what did I say, Seth, the assignment of this will be when I run a function using the call approach.
>> Speaker 5: The r will be passed into call.

[00:05:43]
>> Will Sentance: Fantastic. Which is?
>> Speaker 5: Other options.
>> Will Sentance: Other Opt. Excellent. Okay, and so we now run the body of the increment function. And note, that kinda makes sense, cuz we're not running increment directly, so it's not to the left of the dot, directly. So this .num++ is now gonna be other plus plus are the here it is, plus plus increment to 11.

[00:06:11]
We got to take control of our functions, execution context, this assignment. No more automatic, we manually took control of it. Now apply very similarly. I could easily just switch this out For apply, which is another function available to all functions. I'm really impressed by Nick, you know? Working through that, actually, this is identical.

[00:06:36]
The only difference is if my increment were expecting inputs, with call, I would just do comma, next argument. Which would be first argument here. Comma, next item, which would be second argument here. Whereas with Apply, I put all those arguments, the inputs, in square brackets as an array.

[00:06:57]
So it's just basically one single argument where I put all the arguments that are gonna be thrown into increment in an array. The only slight difference. This always refers the older dot on which the function or method is being called. I bet you the reason is something to do with?

[00:07:12]
>> Speaker 6: You don't have to know how many arguments you're gonna be passing.
>> Will Sentance: Probably.
>> Speaker 6: But you never have [INAUDIBLE]
>> Will Sentance: No discussion. It's a mystery, and it's a mystery for good reason, we should not know this sort of thing. Let's leave it like that. All right, to the left of the dot on which the function method is being called, unless we override that by running the function user .call() or .apply(), which lets us set the value of this Inside the increment function manually, okay.

[00:07:38]
This is gonna turn out to be incredibly useful when on our next approach using new keyword, we really, really need to take control. If we're gonna use that user created function over here, we're gonna use it to create that paid user Well our paid user creator has created an object to be the paid user, so we need to make sure that's the object we use when we end up adding properties using the user creator function.

[00:08:06]
We need to make sure if we're running paid user creator, we're running it with the new, it creates automatically inside an object for us Which is going to end up being a paid user 1. Well that object we want to add properties to it using the pre-written code from user Creator where it's called of this.

[00:08:29]
Well, couldn't we make that this refer to the object? We're making using pages of Creator. This is exactly what we're going to do using our call. But it is brutal. That first line of code inside a paid user create is really a toughy.