JavaScript: The Hard Parts, v2

hasOwnProperty Method

Will Sentance

Will Sentance

JavaScript: The Hard Parts, v2

Check out a free preview of the full JavaScript: The Hard Parts, v2 course

The "hasOwnProperty Method" Lesson is part of the full, JavaScript: The Hard Parts, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Will diagrams the hasOwnProperty method to determine whether an object has a specific property to clarify where the property is stored.


Transcript from the "hasOwnProperty Method" Lesson

>> Will Sentance: Now, we're getting towards the final stretch, almost. So, here, we had it, we had our wonderful shared, single saved version of our function and our objects. User 1, user 2, user 500 [SOUND] all had access to it through the proto-chain. Nope, through the proto-reference, as a result of JavaScript prototype nature, its prototype feature, its ability for objects to connect to other objects.

So, when we don't find a function on the given object, don't panic, head on up. Okay, now, I wanna do something interesting here, no bonus. What if I want to confirm, nothing's changed by the way, except for now I'm not using increment. I'm using this method, this function hasOwnProperty.

What if we wanna confirm our user1 has the property score? This is interesting, hasOwnProperty here. I presume hasOwnProperty is on user1 as a property, Matt, is it?
>> Speaker 2: Yes, I mean, there's nothing there for it.
>> Will Sentance: There's no property, sorry, no method called hasOwnProperty, yeah, exactly. It must be on user function store, is it Todd?

>> Speaker 2: No, it's not.
>> Will Sentance: So where is this function gonna come from? It turns out people, that there is a big old headline object in JavaScript, we're gonna see exactly where it's stored a little bit later on, but for now
>> Will Sentance: There's a big old headline object in JavaScript called object.prototype.

We're gonna learn more about that a little bit later, there it is. I should do it in a different color, honestly. But I'm gonna, instead just kind of, and it has a bunch of useful functions that are gonna be available to, dear. They're gonna be available to all of our objects.

But how? Well because, hey, you won't believe it. But all objects in JavaScript, not just how user 1 and user 2, where we set our proto value, all objects in JavaScript have a proto property. A default one, that defaults to linking to, you wanna take a guess to where Matt?

>> Speaker 2: The object
>> Will Sentance: To this object.prototype object. I'm not gonna probably draw the arrow, am I? But let's just do a little star. This user function stores is gonna link down to this object. The object.prototype object, and what do you bet's in there, Matt? What function do you bet's in there?

>> Speaker 2: hasOwnProperty.
>> Will Sentance: hasOwnProperty, he's spot on, hasOwnProperty, super useful I guess. Such that, when I run user1.hasOwnProperty, and execute it with score as my argument. Kayla, where do I look for user 1?
>> Speaker 3: In global.
>> Will Sentance: In global will I find it? Yeah. Then I look for hasOwnProperty on that object.

Do I find it on user 1?
>> Speaker 3: No.
>> Will Sentance: Definitely not, not there. Do I panic? Where does JavaScript prototypal nature mean that the interpreter is gonna go and look next, up to?
>> Speaker 3: The user function-
>> Will Sentance: Fantastic, maybe hasOwnProperty's here. Is increment, is No. Do we panic?

No, here do we go look, what hidden property that we're gonna look at, Kayla?
>> Speaker 3: The prototype.
>> Will Sentance: The proto property, yeah, yeah. Don't worry, we'll see the difference, but the proto property, which is a link to-
>> Speaker 3: Object.proto.
>> Will Sentance: And what do we find there?
>> Speaker 3: hasOwn.

>> Will Sentance: hasOwnProperty, and we grab its code, and we execute it. What we're actually doing with our object.create is kinda taking control of what we put in that proto. Because all objects by default, their proto, as soon as they're created gets a link to object.prototype. We'd have taken control of that, but don't panic, we don't lose access to this stuff down here, because it is a chain all the way up.

To the point that I kinda want to show the line, just so you know it's a chain, right? It's a chain,
>> Will Sentance: It's a chain all the way up to our headline, Object.prototype. This object also has a proto property. No, but don't panic. Anyone take a guess given this is, I'm just gonna tell you the top of the chain.

What this might have as its value for proto? Dan?
>> Speaker 2: Under naturalised.
>> Will Sentance: Yeah, actually very close but null, yeah, it's like we're done now, there's no further up the chain, okay? But I'm not going to go into this in greater detail than that, but if you do wanna know all the intricacies of that, go watch the object oriented hard parts.

Really [LAUGH] or people's talks on that, go parts on that, we go into in much more detail. Especially related to how arrays and functions also had a big collection of shared functions they can use related to this. Okay, there is another thing I want to talk about though.

Yes, what if you wanna confirm our user's has the property score? We can use the hasOwnProperty method. But where is it? Is it on user 1? No. All of us have a proto property by default which defaults a lead to a big object, object.prototype, full of somewhat, useful functions.

We can access it via user function store's proto property, the chain goes up.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now