new Keyword Example

[00:00:00]
>> Will Sentance: There's our user creator function, notice no creating an object inside of it. No making a bond to some shared store or functions, no returning an object out. Because we're gonna run that function with the help of the new, we can call that a modifier. It alters the behavior of the user creator execution context, it's gonna insert stuff in there automatically for us when we run it.

[00:00:24]
But hold on, we need a shared store of functions one, copper one. What do you say, one save version of those functions. How are we gonna make sure we have a bond to them? Well, it turns out that user creator function is also an object, function object combo.

[00:00:45]
That's what a function is, we just don't talk about the object but most the time. And its object bit has a property called prototype into which we're going to store and increment method. Let's go through people, here we go folk line by line. Jeff, if you don't mind taking it away actually with a full kind of complete description as global memory.

[00:01:11]
Jeff, complete description of what we're doing in that very first line more than just declaring a function, right? What are we doing?
>> Speaker 2: We're creating a label called user creator.
>> Will Sentance: Fantastic, it's a function definition stored it, but what else?
>> Speaker 2: That implicitly has an object.
>> Will Sentance: I don't mind the word implicit there, yeah, it has it is a function object combo, as I like to call it.

[00:01:37]
There it is, it has both a function declaration, or function definition sorry, that is the combination of a function plus an object. That is what we're doing when we're defining a function. We just don't talk about this thing most of the time, but it's there, always. Okay, now, we're not still quite done yet.

[00:01:58]
Adam, this object is not an empty object. It's an object with, what property on it?
>> Will Sentance: What problem is it how automatically towards?
>> Adam: Prototype.
>> Will Sentance: Prototype, and Adam, what is that prototype property got stored in it a big old?
>> Adam: Empty object.
>> Will Sentance: Empty object, so this is literally what we're doing in just our function definition.

[00:02:22]
We just don't talk about this bit of it that often but it's there, function, object combo. And that object's got a property called prototype which is itself a big old object stored on it. How do I get to this object? Dan, what's my kind of words do I write to get to the object here?

[00:02:40]
>> Dan: Creator.prototype.
>> Will Sentance: Usercreated.prototype, and that's going to give me the object. If I wanted to store something in that object Dan, what would I write? Usercreator-
>> Dan: .prototype.-
>> Will Sentance: Whatever the label would be for that that exactly. I'm afraid there we go. Here we go on that note, Dan, what are we doing here because we're gonna use this object like how use a function store was for a single vert save version of each function.

[00:03:04]
That we want any objects that get returned from running user creator to have access to any stored function here. And Dan, what are we gonna store taught me through word by word by word, the left to the right.
>> Dan: We're looking for user creator. We're going to the prototype.

[00:03:23]
>> Will Sentance: Well, I wouldn't use a prototype but it sounds like something magical.
>> Dan: We're going to the-
>> Will Sentance: User creates object version of itself, object part of itself which we look for, what property on it?
>> Dan: Prototype-
>> Will Sentance: Absolutely, which we find is a?
>> Dan: Empty object
>> Will Sentance: Thank goodness, because what we try and do next, we try to?

[00:03:40]
>> Dan: Create a new label increment.
>> Will Sentance: Fantastic, in that object-
>> Dan: And store a function.
>> Will Sentance: I honestly got to say I know in order to do this in this sort of recorded version, but that deserves a round of applause. Thank you, Dan. That was very, very nice.

[00:03:54]
>> [APPLAUSE]
>> Will Sentance: Nice from Dan. Let's have Ethan do the next one here. So looking up user creator, Ethan?
>> Ethan: Yes.
>> Will Sentance: Finding that it's a function plus an object, are we gonna access its function bit here, or its object bit here?
>> Ethan: Object.
>> Will Sentance: Object bit, using dot notation, and it's got a property on the object called?

[00:04:19]
>> Ethan: Prototype.
>> Will Sentance: Which is itself, thank goodness, an object, because we're gonna try and do what with that prototype object. We're gonna try and assign it?
>> Ethan: And label login.
>> Will Sentance: Fantastic, at the property login and assign it a function, a method. Look at that, folks, look at that, that such store of single version of our functions.

[00:04:39]
Okay, good. Now move down to the next line. Braydon, left-hand side. What's that saying? Hold on, let me just do my left-hand side. Braden, what to say to do?
>> Braydon: Don't declare a constant user one.
>> Will Sentance: Declare a constant user one. Do we know what to store in it, Braydon?

[00:04:58]
>> Braydon: Not just-
>> Will Sentance: We have no idea. Do not ever look at that new key word and think somehow user one this is a different to a function. What are we doing on the right-hand side there, Brayden? Hold the new for now, what did you do in right-hand side?

[00:05:09]
>> Braydon: You're calling the user creator
>> Will Sentance: We're calling, we're executing, we're running the user create function with Prince. Nothing magic, nothing different, nothing object, is just literally call user creator. With a special three-letter word in front that's gonna do a ton of stuff inside user creator's execution context.

[00:05:30]
All right, so for now, our user1 is, Brayden?
>> Braydon: Uninitialized.
>> Will Sentance: Uninitialized, yeah, perfect. All right, here we go. This is the final, final piece, people. Okay, user creator, I'm gonna use blue for my stuff that new does. So there's our new, calling, just as usual, calling the function.

[00:05:56]
Just with a slight little change, in terms of what it's gonna do inside the execution context. It's gonna automate a ton of stuff inside that execution context. Calling userCreator with Eva, and 9. I think it's almost our last chance to do this. It's a brand, it's a brand new?

[00:06:17]
>> Speaker 2: Execution context.
>> Will Sentance: Execution context, it sounds amazing. There it is, it's a huge one. There it is, I still, one day I'll get good at that. There it is, huge execution context. Intuit you go, yep, Intuit we go, and,
>> Will Sentance: In our local,
>> Will Sentance: Memory. First, let's handle our parameter argument combinations.

[00:06:53]
Peter, our, inputs to this function, are what?
>> Peter: Eva-
>> Will Sentance: Let's do that one first. Eva, and it's assigned to what parameter, what placeholder inside the function?
>> Peter: Name.
>> Will Sentance: Name, exactly. Don't think these are objects, or properties, or by the way, anything to do with new keyword that is regular inputs for function.

[00:07:14]
The next one, Peter again?
>> Peter: Score is 9.
>> Will Sentance: Yeah, score parameter is the argument of the value 9. That is like if we declare the variables inside this function. We could just write inside here, I don't know, const name is Eva. But we don't wanna make it so non-general, [LAUGH] so inflexible.

[00:07:31]
We wanna be able to have it change each time we run this function, okay? That's, white pen down, blue pen time. The whole point of this function, whatever we're doing here is to create what, Braydon?
>> Braydon: An object.
>> Will Sentance: An object. Do we wanna have to manually declare an object every time you do a function that does this?

[00:07:51]
No, so what's our new key words? First thing it's gonna do, Braydon?
>> Braydon: Assign empty object.
>> Will Sentance: Yeah, declare and save in memory. An empty object. We wanna be able to get access so we can stick stuff into it. What is the label we've given to access it, Braydon?

[00:08:10]
>> Braydon: This.
>> Will Sentance: This, exactly beautiful, set this to empty object. Beaituful. All right. But we will not object when it eventually gets returned out into user one to have access to our single save version of the functions. We want it to have access to remember, our whole goal here.

[00:08:34]
So I can do this using one little increments. That's the only goal of the whole workshop. Is the icon have the functionality that applies to that user one, not all over the whole 100,000 lines of code, but instead, right there on our user one object. Not being shared by all the quiz questions in the league tables, no.

[00:08:57]
Right there, on our user1 object, it's our only goal. But know we can't have increment function directly stored on that object, we wanna have instead a link through its proto reference to.
>> Will Sentance: this shared store of functions. And so Braydon, what do you think their hidden proto property is going to link to?

[00:09:18]
Be very specific, exactly where?
>> Braydon: It's going to link to the object part of the user creator function to the prototype property.
>> Will Sentance: Which is itself?
>> Braydon: An object.
>> Will Sentance: An object, full of the functions that we've put in there. Very, very, very nice there, much appreciated by Braydon.

[00:09:38]
From Brayden there, up to that object, fantastic. Okay, now we're back to us. So that's the second thing it does, set proto to the function that's being run, onto its prototype property of its object version, which is itself an object. So we set the proto to userCreate, or whatever the function is, this has been rather the new keyword .prototype.

[00:10:11]
This is all automated by the new keyword for us. This is looking pretty nice already, right? But now we've got to get some actual specific data in. Dan, to you
>> Dan: We run the line the stack name,
>> Will Sentance: Fantastic.
>> Dan: We add this in the local memory,
>> Will Sentance: Yeah.

[00:10:26]
>> Dan: And creates a new label name signs that the name-
>> Will Sentance: I would say here, because we don't wanna get confused with our
>> Dan: Yeah.
>> Will Sentance: Variable names or parameters, a new property name and very unhelpfully chosen by me, which is gonna be work, Dan?
>> Dan: The argument that was passed in.

[00:10:43]
>> Will Sentance: Which is? Fantastic. By the way, Dan your technical communication is outstanding. And then the next line?
>> Dan: Same thing but with score on this-
>> Will Sentance: The auto-created object with the help of the new keyword, which has got the label?
>> Dan: This.
>> Will Sentance: This, exactly, and we go to it and we find, does it have a score property?

[00:11:03]
>> Dan: No.
>> Will Sentance: No, so we make it, there it is. And we assigned to it, what, Dan?
>> Dan: 9.
>> Will Sentance: The value of our school parameter which is the argument that was policy which is 9, exactly. Folk that is a pretty nice, that's exactly what we want. But it's stuck inside a function, inside of our user creator, and I'm looking at user creator I don't see anything returned out.

[00:11:26]
What Mark, do you think is the last thing that our new keyword automates?
>> Dan: Returning the this.
>> Will Sentance: Remember that, returning this, exactly right. Returning the object assigned to this, keyword, I like to do it in blue as well, right? Because it's automatic, returning it out into the global label.

[00:11:53]
This whole portion here evaluates turns into the returned object, and stored into what? Into user1 with name, it's funny that I've now changed the color, is not helpful. There we go, well, dear, yeah, with our hidden proto property__proto underscore which is a link up to userCreator.product this big object for the shared functions.

[00:12:38]
Okay, now execution context here, stays or goes? Goes, exactly, popped off the call stat. We didn't show the call stat, but it's deleted, and now we do our all important check. The only thing we really cared about the whole time. If can I do user1.increment. And by the way people, this is why I'd tell you solution two, did the job.

[00:13:07]
Solution three is just automating so much of that job for us, which is fantastic. But under the hood, it's exactly the same, in terms of doing exactly the same stuff. Yes, it has to make a few little changes. We have to put all our functions in this object, cuz we don't get it controlled.

[00:13:24]
So we better put it somewhere where JavaScript knows they're gonna be. We've got this as the label for the object. But otherwise, it's exactly the same. Also, we can do this one thing. Have our functions and data bundle together for our ease of reasoning, but we can't have the functions literally on the object.

[00:13:43]
Otherwise, I've been copied on every single user object, user one, user two, user 500. We waste memory space. So instead, we have them in one place single save version. And the proto feature of Java prototype will feature JavaScript. It's proto property that all objects have a. We set it to link up to that object, knowing that when JavaScript runs user1.increment, and does it fight well, let's see.

[00:14:13]
Todd, it's your moment. User1 where do we look for it?
>> Todd: Global memory.
>> Will Sentance: Global memory, is it there?
>> Todd: Yes.
>> Will Sentance: Yes, it is, increment. We look on, well, you tell me?
>> Todd: Not there.
>> Will Sentance: [LAUGH] Good-
>> Todd: [LAUGH]
>> Will Sentance: Queue one object, not there. Do we panic?

[00:14:26]
>> Todd: No.
>> Will Sentance: What does JavaScript do automatically?
>> Todd: It'll take the proto, it'll follow that up to the user creator object, and the prototype property in that object, and look in there.
>> Will Sentance: Absolutely outstanding, and find?
>> Todd: Increment.
>> Will Sentance: Increment, and then we take that code, and we build an execution context.

[00:14:49]
Amazing, let's give Todd a hand, very nice from Todd. That for me is the hardest bit. Excellent, people. That's it, a new keyword has sold at least some of our typing too much problem, but my goodness,