233W PrototypeLecture 1 start 5m 52s

Now let's go ahead
and make another constructor.

So this time,
I'm going to create a Dalmatian class....

And it's going to be a dog
with the color...

[slowly]
white with black spots.

But obviously, I haven't...

created any kind of relationship
between "Dalmation"

and "dog" just yet, so if I reload--

oh! Syntax error.

Let's see where that is....

Oh, I forgot my parentheses.

This is a function.

So obviously, if I set "spot"

to new...

Dalmation, Dal-ma-tion....

Let's try that again.

So now "Spot" is a dog,

but only the color property
is set.

So I can say "spot.color,"
and that works fine,

but if I say "spot.speak,"

that doesn't work at all.

So, in order to define
the inheritance relationship,

I need to do something
a little odd.

So let me give you
a little background first.

So, if you're used to a language

like C++ or Java or C#,

then the way that you define
an inheritance relationship

is you have a base class,
like dog,

and then you extend
that base class

by creating a subclass, like Dalmation.

So...

the way you do it in JavaScript

is a little different.

So JavaScript is known
as a prototypal

or "proto-tip-pal" language,

where inheritance is based
on prototypes.

So what is a prototype?

A prototype is an object.

So the way you define
an inheritance relationship

is you set a base prototype,
a base object,

that the sub-object
that you're creating

inherits all the properties from.

So instead of extending a class,

which is a blueprint
for a set of objects,

instead,
you're extending an object

by adding additional methods
and additional properties

to the base set of objects
and properties

that that object has.

So what I want to do, basically,

is I want to create a new dog,

which is the prototype for all Dalmations,

and then I want to inherit

that prototype

for all Dalmations that I create.

The way that works is the constructor,

the Dalmation function,

has a prototype property, which is an object.

So whenever you create a function,

there's going to be a prototype property

for that function, let's take a look at it.

So Dalmation,

which is a function.prototype,

is an object

with a constructor function, and actually,

this constructor function, if I open this up,

the function is Dalmation.

So an object whose function, constructor function,

is a Dalmation, is the prototype

for all Dalmation objects.

And there aren't any other properties

that are really interesting or useful on this object,

because I haven't set any, but for example,

if I set Dalmation.prototype.legs = 4...

And then I said, spot.legs,

all of a sudden, Spot, an existing Dalmation,

inherits the number of legs

from the prototype of the Dalmatian class.

So I can do this for other properties as well.

So dog.sound is bark,

spot.sound is now bark as well.

And this will be true for any other dog that I create.

So for example, Rover is new Dalmation as well.

rover.legs is four,

rover.sound is bark,

but I still haven't set a property

for speak, so that's still going to be an error.

So this suggests a way of doing inheritance,

which is to make sure that all of the properties

defined for dog are also set

for the prototype object for the Dalmatian class,

and there's a really easy way of doing that,

which is...

Dalmation.prototype = new Dog.

So Dalmation is going to have a prototype object

because it's a function,

but I'm overriding that default generic object

with a new dog.

So any new dog that I create

is going to have all of the properties

that are defined for dog.

So let's go ahead and-- actually let me save this...

Save...

and then reload,

and now, I'm going to create Spot is new Dalmation.