I am mpj and this is fun fun function to
you new viewers I do not normally look
like this I guess I’m a bit hungover
today so I just feel like wrapping
myself in a hoodie so what are
prototypes let’s say that you have food
in your software and you you want to
make more kinds of food you want to make
God waffles and I guess what if you have
waffles you need no other food but um
let’s say you maybe like carrots or
something in that context food is the
prototype of waffles and carrots some of
you are now thinking that reminds me of
classes and you would be right because
Pertex do remind of classes but they are
not the same thing so for this video try
to put classes aside and see prototypes
as a new thing and not shove prototypes
into that part of your brain where you
keep your classes because then you will
just be confused and unhappy
anyway let’s create a food object Tom’s
food equals object literal we’re gonna
give it a init method and that init
method is going to take a time and and
we’re going to assign that time to a
property on the current object and we
are going to have an all-important eat
method oh you ate the this don’t time
so as you see this is just a completely
normal object it has an init method ah
that assigns the type in fact we’re
gonna do that now gonna go food don’t in
it and we’re going to have a waffle and
it has the all-important eat method that
ah logs out you ate the list of time
plaits lets you set now who don’t eat
and let’s run that prototype chaos
that’s the file and you ain’t the work
phone this is fine but what if we want
to create more types of food objects
like those carrots I just realized that
I should give you full disclosure here
because my teeth might be red
drinking’s and we carrots this is where
object.create comes in I’m going to
delete these two lines here and I am
going to do a new calls god-awful and go
to object dot create food and on this
one we’re going to the net then to give
time for whole and we’re going to go
waffle eat and that you ate the waffle
we’re back to where we started but let’s
get that carrot into place to using
cones here Const means that you cannot
change the variable later otherwise it’s
just like let you should always use
cones if you don’t explicitly need the
mutability of o of let or bar for that
matter you should not use forever
unless you’re in some old environment or
something and we are carrots don’t darn
it carrot and Cara don’t eat you all
know what this will return you eight
waffle you ate the carrot looking at
this example you might infer that
object.create creates a copy of the
object let’s see if that is true don’t
you move this up a bit mm-hmm and I’m
gonna do this food don’t eat us function
also not log you total aid the like this
and we’re on it
what do you think will happen
ah I will suck and not being able to
code right
again you totally a doubling you truly
it occurs but this is kind of stranger
this means that object dot creates
cannot possibly be creating copies
because if it did this food eat would
not be affecting the the eat methods of
waffles and carrots because they should
be copies right but they do since you
totally ate the waffle the new method
signature does affect the waffle and
carrots even though we assign it to the
food object this is of course because
the object of trade does not create a
copy of the food object instead what it
does is that it creates a new empty
object for
waffle and carrot and it assigns food to
be a sort of fallback for those so
whenever we call a method or a property
on on a carrot or a waffle ah that
doesn’t exist on the carrot in the
waffle it will look in its prototype
object the food object and see if it’s
there
and then if it is it will use that one
and that is what we mean by waffle and
carrot having food as its prototype so
object.create
creates a new object and assigns food as
its prototype but one fall and carrot
will only fall back to food if it lacks
the property if it has the property it
will use that let me show you what that
means I am going to delete all the
carrot stuff from here carrot carrot
carrot empty lead and we no longer the
need this example but I am going to add
another eat method I’m going to clear
this and now we’re gonna run it just to
see what it looks for the tires don’t
change as you wait waffle you way to a
funny way too often now let’s see what
if I do this food dot tie what will he
die he will type when I run what do you
think will happen I will give you a
golden star if you figure this out
before I run it what do you think three
two one you knew that one right but what
if I comment out the in it a check it no
don’t prototypes but yes
did you guess correctly you guessed you
ate the undefined you a tip zip zip zip
city so in this first eat call here
waffle will not have a anything assigned
to the type property and when it
books in its prototype the food object
it will not have anything there either
so it’s going to return undefined
however here we assign this string to
the type property on the food object
which means that when in this second
call here waffle dot eat will well it
won’t still won’t find any type property
on itself because well that’s assigned
here in the init function and the init
function is commented out but it will
fall back to its food prototype and
there it will find the food type step
zip zip zip zop and I’ll put it here
I also quickly want to mention that you
can use prototypes to do type checking
going to delete this part here and bring
back the carrot and waffles that we saw
before and now you can actually do food
dot is prototype of waffle you could do
food its prototype or one two three four
five integer and food is prototype or
carrot this is super exciting
entertainment and I are gonna do in its
food do you know what this can be I
think you do I
I think you’re anticipating this are we
running it no our prototypes dr.azz and
what police food to end his food falls
and just chew yeah carry these food know
what okay or cabbie is food clear act
clear oh my god I’m so tired right
Carrie Carrie I roll
carrot is food true so you see that you
can use the food prototype to see if
that is used as a prototype in different
different objects and that is an
excellent way of doing type checking and
that is the basics of prototypes there
really isn’t much more to prototype some
done however while the concept of the
prototype is simple it does have some
very cool implications for the language
so on the next episode we’re going to
explore that a bit we’re going to
explore why prototypes or more powerful
than classes and I’m gonna show you some
cool tricks that you can do with it
do not miss that episode as usual it
will be released next Monday morning Oh
800 GMT butch if you want more videos
like this one right now you should check
out either the composition over
inheritance video or the factory
functions video I am mvj this is fun fun function until next Monday stay tuned