Transcript of the tutorial.
TOP
So now we know a little bit more about object oriented JavaScript.
I'd like to take all the principles we've learned in this chapter all about classes and inheritance
and apply them to our weather app.
But before we do that, I thought it would be a good idea just to talk about some built in objects into
the JavaScript language.
Now these objects that we've already seen before in previous lessons, However, now we know a little
bit more about object oriented programming.
We can see them in a new light because we understand what the prototype model is and what that little
proto property is.
So I'm going to start off by saying new array and I could have just as easily use square brackets.
But I think sometimes when you use the new keyword, it's more explicit that you're creating a new object.
So it's easier to demo this way.
And then I'm going to just add in a few different values one, two, three, four, five.
And then if we expand this array object, we can see the properties.
But now we see this proto property right here is pointing to the array prototype.
And if we expand this, then we can see all of the different methods that are stored on the array prototype
that we can use inside the array or on the array.
Now if we scroll right to the bottom, we can also see this other prototype property right here, and
this is pointing to the object prototype.
So what we're doing is actually storing all of these methods on the array prototype, but we're also
inheriting methods from the object prototype.
And if we expand that, we can see all the different methods we inherit from the object prototype.
So now if we create just a new object, so we'll say new object, and we don't need to pass anything
into this, but we can expand it.
And if we look inside the proto where all the methods are, all these methods are the same as the ones
in here, because ultimately the array object has its own methods, but it's also inheriting the object
methods.
And these are these things.
So these and these are the same because we're just inheriting them.
And ultimately every object type in JavaScript is going to inherit from object, which is this thing
right here.
This is like the base type in JavaScript with the basic methods attached to its prototype.
So let's do another example.
I'm now going to say new XML http request object.
And now if we see this, we can see all of the different properties on it.
If we look in the proto, we can see it's pointing to the XML http request prototype and if we look
in there we can see all these different things.
But if we scroll right to the bottom, this inherits from another prototype which is Http request event
target.
If we expand that, we can see all these different methods at the bottom.
It's inheriting from event Target.
If we go down even more, it's inheriting from the object and this will be the last thing in the chain.
So if we expand that, there's no more proto property at the bottom.
So like I said, everything ultimately inherits from object and along the way, this one is inherited
from quite a few different things until eventually we have this one at the top, the XML http request
object.
So hopefully now this demonstrates a little bit more how Prototypal inheritance works in JavaScript,
even with the built in objects that we've seen already.