I am trying to understand prototypes and dealing with some interference from my understanding of various other constructs.
Can someone explain to me what Object is in Javascript? To clarify, I know what an object(with a lower-case 'o') is, but not what Object (with a capital 'O') is. I understand that any object that is created in JS has a hidden prototype object attached to it. The prototype object is both a property of the parent object, and an object itself, with its own properties that can be accessed using the following mand objectName.prototype; additionally, among the properties of the prototype object is a prototype object. Is Object the same as prototype object? If not, what is Object -- the global object? How does it/they relate to the window object or global object?
Thanks in advance for your help. I've scoured the internet for an answer on this, and couldn't find one that was both accessible or understandable. Although I'm not a 10-year old, if you would kindly explain it to me as though I am, I won't be offended, and will greatly appreciate the effort.
I am trying to understand prototypes and dealing with some interference from my understanding of various other constructs.
Can someone explain to me what Object is in Javascript? To clarify, I know what an object(with a lower-case 'o') is, but not what Object (with a capital 'O') is. I understand that any object that is created in JS has a hidden prototype object attached to it. The prototype object is both a property of the parent object, and an object itself, with its own properties that can be accessed using the following mand objectName.prototype; additionally, among the properties of the prototype object is a prototype object. Is Object the same as prototype object? If not, what is Object -- the global object? How does it/they relate to the window object or global object?
Thanks in advance for your help. I've scoured the internet for an answer on this, and couldn't find one that was both accessible or understandable. Although I'm not a 10-year old, if you would kindly explain it to me as though I am, I won't be offended, and will greatly appreciate the effort.
Share Improve this question asked Nov 7, 2018 at 23:15 efwefw 4694 silver badges16 bronze badges 4- I hope I could clarify some of your doubts. Please let me know if anything is still unclear. – Felix Kling Commented Nov 7, 2018 at 23:53
- Felix, thanks some much for the detailed answer. Still not there, but closer with your explanation. So, Object is a constructor that allows for one object to inherit the properties of another. In your example, you create an object called bar -- using the Object.create method with foo as its argument . This allows bar to inherit the properties of the object called foo. When executing bar.x, the interpreter will first look for x in the object called bar, and not find it. However, because bar is linked to foo through a prototype chain, it will look for x in foo, and get its value. Correct? – efw Commented Nov 8, 2018 at 0:52
-
Basically. However,
Object
andObject.create
are two different functions, don't confuse those.Object
also acts a "namespace" for a bunch of object related functions. To be clear: Almost every object has a prototype. The specific value depends on how the object is created.Object.create
lets you specify the prototype explicitly. When usingnew C()
,C.prototype
is the prototype. When using an object literal ({...}
),Object.prototype
is the prototype (because it's equivalent to doingnew Object()
). Similar for array literal ([...]
is equivalent tonew Array()
), etc – Felix Kling Commented Nov 8, 2018 at 1:00 - As for property lookup, that's correct. My explanation has primarily focused on what prototypes are, not what they do or are used for. But yes, they are used when a property is accessed. – Felix Kling Commented Nov 8, 2018 at 1:04
1 Answer
Reset to default 9I understand that any object that is created in JS has a hidden prototype object attached to it.
Basically yes. Every object has an internal property, denoted as [[Prototype]]
in the specification, whose value is simply (a reference to) another object. That other object is the first object's prototype.
A prototype object itself is not hidden though, and you can explicitly set the prototype of an object, via Object.create
:
var foo = {x: 42};
var bar = Object.create(foo);
console.log(bar.x); // 42
console.log(Object.getPrototypeOf(bar) === foo); // true
In this example, foo
is the prototype of bar
.
The prototype object is both a property of the parent object, and an object itself
First of all, there isn't only one prototype object. Any object can act as a prototype and there are many different prototype objects. And when we say "prototype object", we are really referring to an object that has the "role" of a prototype, not to an object of a specific "type". There is no observable difference between an object that is a prototype and one that isn't.
I'm not quite sure what you mean by "property of the parent object" here. An object is a not property, at most it can be the value of a property. In that sense, yes, an object that is a prototype must be the value of the internal [[Prototype]]
property of another object.
But that is not much different than every other relationship between two objects (so nothing special). In the following example bar
is an object and also assign to a property of foo
:
var bar = {};
var foo = {bar: bar};
Is Object the same as prototype object?
No.
Object
is (constructor) function for creating objects. var obj = new Object();
is the same as var obj = {};
. However, using object literals ({...}
) is more convenient which is why you are not seeing new Object
used that much.
For every constructor function C
, the following holds true:
Object.getPrototypeOf(new C()) === C.prototype
i.e. the value of the C.prototype
property bees the prototype of new instance of C
created via new C
.
Object.prototype
is actually the interesting part of Object
and the most important one. You may have heard about the "prototype chain". Because a prototype is just an object, it has itself a prototype, which is an object, etc. This chain has to end somewhere. Object.prototype
is the value that sits at the end of basically every prototype chain.
There are many prototype chains because every value that is not a primitive value (Boolean, Number, String, Null, Undefined, Symbol) is an object (which includes functions, regular expressions, arrays, dates, etc).
If not, what is Object -- the global object?
See above. It's not the global object, the global object in browsers is window
, and while every JavaScript environment must have a global objects, at least so far there is no standard way in the language to reference it (edit: I guess this
in the global environment would one cross-platform way).
How does it/they relate to the window object or global object?
The only relation really is:
Object
is a property of the global object, and thus a global variable.
You may think the global object's prototype is also Object.prototype
, but that is not necessarily the case
Reading material:
- You Don't Know JS: this & Object Prototypes ; all of gettify's books in the series are pretty awesome.
- http://felix-kling.de/jsbasics/ ; shameless plug for some very concise slides that I created for a JavaScript class that I'm teaching from time to time. Might not be detailed enough to be useful on it's own (and contains typos ;) )