Transcript from the "Prototype Chain" Lesson
>> Will Sentance: All right. Now let's do our all important check. Let's do our all important check. Here it is our vital check. Can we call our functionality on our object that has the data of the user? User 1 here could be user 2. Can we do it? Because the function definitely don't look like it's on user 1.
>> Speaker 2: Yeah, that's your life then.
>> Speaker 2: User 1 is in globals.
>> Will Sentance: Global memory, global memory, there it is, hooray. What are we looking for on it?
>> Speaker 2: Increment.
>> Will Sentance: Increment, do we have it?
>> Speaker 2: We're gonna find it by reference.
>> Speaker 2: The user functions store.
>> Will Sentance: User functions store where it finds?
>> Speaker 2: Increment.
>> Will Sentance: Beautiful. Okay, folk, let's talk about how that bond is made because it really would be the worse session on front end masters ever if we just left it as the pink line. The pink line leads up. So how actually is made is this people. As soon as you declare new user and as soon as it returns on an object using object.create, it sets a hidden property.
[00:01:27] I will stand by what I said. It is an empty object that gets stored in new user. But you will see an empty object stored in new user and then you add the name, score, property, return. There is no increment property on here. And if only these two properties that are locked in but, there are hidden properties and objects that give them bonus features, and you can see them.
[00:01:53] As soon as you declare a new user and you assign it that empty object, you press that little down arrow. In the Chrome dev tools, you see a bunch of kinda light gray properties. One of them-
[00:02:33] The spec name was even worse named. So,anyway, whatever. This is a hidden property, the pink stuff is a hidden properties, and under score proto, dunder score will have a little link to where, Seth?
>> Speaker 3: The the user function storage.
>> Will Sentance: To user function storage and what we passed into object.create that gave us the empty object with the hidden reference up.
[00:02:58] And note people, yes, it says user function store. Do not think that means we're copying user function store onto here. We're just saying, make a link up to it. Make a reference to where this object is stored in memory. Such that when we return out this object, it brings with it its little hidden bond.
[00:03:20] Up to, through the dunderscore proto dunderscore it's bond up to user function score. Same thing on this object.
>> Will Sentance: It's dunderscore proto dunderscore bond up. So who would like to talk through the lookup process here now, in terms of our proto reference. David, I knew from the look in your eyes that you wanted to user 1, where is it?
>> Speaker 4: In the global skull.
>> Speaker 5: As many as you like.
>> Speaker 6: Increments.
>> Will Sentance: Does it find it? It does not. Does it panic? Does it error at this point?
>> Speaker 6: In IE, yes.
>> Speaker 7: Proto.
>> Will Sentance: The proto property. Not prototype, we'll see that later on a totally different thing.
[00:05:02] The proto property. The dunder proto dunder. The dunderscore proto dunderscore. The double underscore proto double underscore. And it sees there a little link up to what?
>> Speaker 7: User, user incriment store.
>> Will Sentance: User function store, where we find what?
>> Speaker 7: Incriment.
>> Will Sentance: The incriment function. We can then grab its code, create an execution context to execute it.
[00:06:42] So that it looks cleaner, but to actually use it effectively? We're gonna need to, they're gonna add little bonus bits here and there which make it more complicated, more and more complicated. It will look cleaner and cleaner, but under the hood, it's more and more complicated. We're getting on that full journey Today.
[00:06:57] All right, so we have successfully found our function even though it is not on our object. Lets have thumbs at this point. No idea what happened here. I am clear. I have clarifications. Everybody's thumbs out. It's absolutely okay to have clarifications. Terry, is that a clarification? Or a weak thumb?
>> Speaker 7: Weak thumb.
>> Will Sentance: Okay, all right, problems with this one. There are no problems. This is beautiful. Maybe it's a little bit long winded folk. Once you start thinking about your application as objects that combine the relevant data. Name score of a user with the relevant functionality, the increment module function.
[00:07:42] In reality, there's a lot of those. You start doing that for everything. Even if, for example, you had one, these instances I don't love that name is not really in the classic sense of instance. Even if you have one object requires of example or one of a thing.
[00:08:00] So suppose you have in your app. You have one app, right? One quiz game board. Even if you just doing that you're probably still going to make it as an object to capture the data over the dimensions of the board the color of the board, whatever. Some details of it, and the associated functionality.
[00:08:20] Maybe render the board. You're still gonna capture that as an object, and therefore create a function that will return that object out with the data, and then the functionality off in some shared function store. Even though you're only gonna have one of them. Not like users where you may have 40 players at the same time, 1,000 players at the same time, you just may only have one of them but you're still going to produce that object with it's data ar functionality together from a function.
[00:08:46] So I guess this process of hand crafting an object, hand returning it out from a function, hand making the bond to a set of shared functions. I guess that becomes a little bit repetitive. If you saw a thing about everything you do is objects with right data and functionality bundled together.
[00:09:12] With the right data and the right functionality bonded together. And you're gonna produce them from functions, you're making a lot of objects by hand. You're making a lot, you're writing the creation of the object with a local label, newUser in this case. The returning of that object out, the bond to the shared functions.
[00:10:32] The making of the object, the crafting of the bond to the shared functions, and the returning of the object data. We're gonna give you a three letter word that will automate that process for you. That three letter word is, everyone together New.
>> Speaker 8: New, that wasn't everybody together, but nevertheless.