Javascript `new` Operator & Prototype
Solution 1:
When you access a property on an object, Javascript looks first directly on the object for any properties that have been added directly to the object (these are called "own" properties). If it doesn't find the property there, then it looks up the prototype chain.
So, when you do this:
varTriangle = newShape();
console.log(Triangle.toString()); // 'Shape'
it looks for the .toString()
property on the actual object named Triangle, but there is no property by that name directly on that object. So, since it didn't find anything on the object directly, it then looks on the prototype and it finds the Shape.prototype.toString()
implementation there and that is what is executed.
A reference to the prototype is stored on the Triangle object when it is created. It is not stored in the .prototype
property - that property is only used on the constructor. Instead, each JS version has its own way of storing a reference to the prototype and it has traditionally not been the same for all browsers and how it was stored was non-standard. It was originally meant only for internal use by the JS engine. For example, Chrome stores it on a property named obj.__proto__
, but IE does not. To fix this lack of standardization, there is new method called obj.getPrototypeOf()
which can now be used in modern browsers to get access to the prototype for a given object. In any case, the JS engine searches this prototype for you automatically when resolving property names that are not found on the actual object itself.
If you did this:
varTriangle = newShape();
Triangle.toString = function() {
return'Shape named Triangle';
}
console.log(Triangle.toString()); // 'Shape named Triangle'
Then, javascript would first find the toString()
implementation that you attached directly to the object and it would execute that one rather than the one on the prototype.
Solution 2:
So I am adding according to what I know.
Here Shape
is a function & A function is just a special kind of object, and like any object a function can have properties.
Functions automatically get a property called prototype
, which is just an empty object. This object gets some special treatment.
When you will do a new
of a Function
the created object inherits all of the properties of its constructor’s prototype.
Like bellow
varShape = function () {};
Shape.prototype.name = 'Shape';
Shape.prototype.toString = function () {
returnthis.name;
}
When you will say
var Triangle = new Shape();
So what it does
varTriangle = {};
Triangle.name = Shape.prototype.nameTriangle.toString = Shape.prototype.toString;
"it sets up the object Triangle
to delegate to Shape.prototype."
So when you will do
Triangle.name//Shape
Triangle.toString() // Shape
But for Shape
you will have to say
Shape.prototype.name//ShapeShape.prototype.toString() //Shape
Solution 3:
because Triangle
is an object
, where Shape
is a function (a kind of an object), therefore when you request for a property of a function and it will not find it, will not search throught it's prototype
propery. But you can modify Function.prototype.name/toSTring()
Post a Comment for "Javascript `new` Operator & Prototype"