In the last talk-through, we learned how to make an object type
to represent our two Winston-like objects
and then initialize them with the constructors.
Now, an object type doesn't just have to be associated with properties.
It can also be associated with functionality.
Think about the world and all the object types in it, like us humans.
We all have height and age,
but we also have things we can do like sleep, and eat, and program.
And we wanna be able to associate those functions with those object types.
In this program, which is just where we left off from last time,
we've a funciton here, drawWinston, that we call on both Winston objects.
Wouldn't it be neat if we could just attach that to the Winston object type?
Well we can, and it's easy to do.
So underneath our constructor, we're gonna write Winston --
capital W -- dot prototype.
And the "prototype", that's a new word that you probably haven't seen before.
And the prototype is this property of an object that we can attach
functions to and it will mean that every object that's an instance of that
will then have those functions on them.
So we can say dot prototype and then dot, and then the function name.
So we say draw, equals, and then we can go and take our drawWinston code
and we can just put it, move it, inside here.
All right, so now what we've done here is we've attached a draw function
to our Winston prototype.
And that means that we should be able to call draw() on any Winston-type object.
All right, so we should be able to call draw() on winstonTeen or winstonAdult.
And when we have a function like this, that we can call on an object,
we actually call that a "method." So you might hear me say "method" now.
So let's say this is "the draw method." Okay.
So now we'll delete this, and we'll delete this, and now we're gonna see, can we call draw()?
winstonTeen.draw()
Okay. We have an error.
We've had this error sticking out here, so it says "winstObject is not defined"
Okay. So, before, we were passing this argument into drawWinston,
which was the Winston object, but now we're not passing it any more.
So, we could change this to pass it, and then, let's see,
what would we pass here? We'd have to pass winstonTeen.
Okay, that worked, but that seems also really silly.
I'm already calling draw on the object itself.
I shouldn't have to pass in the object as well.
That seems redundant.
And that's true, we shouldn't have to do that,
So let's delete this here, and now let's think.
If we're inside the object, what could we use
to access the properties of the object?
Well, you might look up at our constructor and remember that special keyword
"this" and think "Ahh, what if we just change this, to this!" (laughter)
So we change winstObject to "this".
Because we're inside the object right now. This function is being evaluated
on the object, so the "this" will refer to that current object.
And so that way we can just say "this" and we'll get access to all
the properties of this current object.
And that totally works, see? Isn't that cool?
So now we can then say winstonAdult.draw()
Tada! And it will access the properties of winstonAdult
because that's the object it's being called on.
So that's what's really cool about this "this" keyword,
even though it can be kinda confusing to say sometimes.
All right, so, that was a lot of fun. So let's add another method.
Okay, so, what else might Winston do?
Maybe he'll talk. So we'll make a Winston.prototype.talk
so we can attach as many methods as we want to the prototype.
So we'll say, "I'm Winston!"
And then we'll just say this.x+20, and this.y+150.
And then, y'know, nothing happened,
but of course that's because I didn't actually call that function yet.
So, let's make the teen talk, winstonTeen.talk() [inaudible] talk all the time
Okay. I'm Winston, tada! And then winstonAdult.talk()
Tada!
All right, so now we have this Winston object type that has properties:
nickname, age, x, y; and it has functionality: behaviors, methods;
that act differently depending on the properties,
and we can create as many instances of Winstons as we want
and call any of these methods on it.
It's pretty cool, huh?