Welcome back.
In this video we're going to be talking about prototypes.
We'll first understand what the prototype object is we'll then describe and diagram the relationship
between Dunder Prato prototype and constructor will then add methods and properties on the prototype
object to write more efficient code.
And finally we'll be able to explain the difference between adding methods and properties to the prototype
versus the constructor function.
But before we get deep into prototypes Let's quickly review one more time with the new keyword does
first it creates an object out of thin air.
Second it sets the value of the key word this to be that object created in the previous step.
Third it adds a return to the constructor function.
Finally it creates a link which we can access as Dunder Prato between the object created and the prototype
property of the constructor function.
Let's talk a bit more about that point.
Better yet let's diagram this relationship.
Don't be too intimidated by this diagram.
Let's walk through it step by step as a guide.
A circle is a function and a square is an object.
So here we have a person constructor function which has a property called prototype which is an object
that object has a property on it called constructor which points back to the original constructor function
.
If properties or methods are placed on the person prototype they can be accessible from any object created
from that constructor function the way in which these objects which are created by the constructor function
get access to the prototype object is through the donder Prato link.
This link gets established when the new keyword is used.
To recap every constructor function has a property on it called prototype.
The prototype property is an object which can also have methods and properties attached to it.
These methods and properties are shared and accessible by any object that is created from that constructor
function.
When the new keyword is used.
Now let's see what this looks like with the code example.
I'm going to copy and paste this code in the chrome console and we can walk through each line of it
.
First I have the constructor function called person with a property called name.
Since I created a function we can already see that there is a property on the function called prototype
.
Now I'm going to create two objects called an LP from my constructor function using the new key.
Since I use the new keyword a property has been added to each of these objects called Dunder produ which
points to the prototype property on the person constructor.
We'll discuss in the next video why this prototype property is so useful.
Finally the prototype object has a property on it called constructor which points back to the original
constructor function.
The constructor property is not something you'll be using or manipulating frequently but it's an important
part in a concept called inheritance which we'll discuss in another series before we end this video
.
I want to jump back a couple of slides to the diagram so that we can go over it one more time.
Remember circles are functions and squares are objects.
So here I have two objects called Ellie and cold which were created from the person constructor function
.
The green circle.
Since I use the new keyword when I created them.
Each of these objects has a property called Dunder Prado which points to the prototype property on the
person constructor.
In the next video we'll examine the prototype object and see just how useful it is.
See that