By default, every function has a property called prototype this property by default is empty and you can add properties and methods to it and when you create an object from this function. The object inherits its properties and methods.
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
How prototype works in java script?
1. How Prototype Works in JavaScript?
By default, every function has a property called prototype this property by default is empty and
you can add properties and methods to it and when you create an object from this function.
The object inherits its properties and methods. It has been often confusing to the beginners
“How Prototype Works in JavaScript” and with this, you will also get the idea of what is the
difference between prototype and __proto__. Also, JavaScript does not have class
implementation as other languages like Java or c#, whereas it is considered as prototype
language and just like in java you create a class and then create an object from it, in JavaScript
you would create constructor directly and using this constructor you could create an object
from it.
Here x is a function and x1 is the object created from the function x.
Any function created in JavaScript either a constructor function or generic function. These two
objects are always created a function object and prototype object, the function object holds a
property prototype property & with the function name and dot prototype we can access the
prototype object properties.
A prototype is the property of function which points to the prototype object. Prototype object
can be accessed using Funtion_Name.prototype.
2. When the object is created using the new keyword of the function/constructor, The JS engine
creates a new object of that function block which holds a property named __proto__ which
points to its function's prototype object.
If another object of that function using a new keyword again another object is created which
holds a __proto__ property which again points to the function's prototype object.
the same goes for every object which is created for the function using the new keyword.
It can be checked by:-
lg.__proto__ === Mobile.prototype //true
So, any property which is defined inside the constructor/function is accessible by the object of
that function which was created using the new keyword. so when we try to access a property
like lg.a it is firstly searched in the object of lg and if not present it is then searched in the
prototype block of the constructor function. and when it is not found even there than it gives
undefined.
A property can also be defined inside the prototype block using
functionName.prototytpe.propertyName = 'Value';
3. if a property with the same name is defined inside both the object as well as function prototype
than it is accessed from the object block. So, the first Priority is of the object and then function
prototype.
function Fun(){
this.a = 20;
}
Fun.prototype.a = 10;
let chk = new Fun();
console.log("The output is:- " + chk.a); //The output is 20
Also, the function object holds the function in it and whereas the object of that function also
holds the function in its constructor. the same can be also verified by
console.log(Mobile === lg.__proto__.constructor); //true.
the same hold true for the prototype of the function as its constructor also hold the function in
its constructor this can also be verified by
console.log(Mobile === Mobile.prototype.constructor) ; //true
so, basically, the function can be accessed using different ways.
InnovationM Technology Solutions
A-36, Sector-4 Noida 201310
Sales@innovationm.com
https://www.innovationm.com/
+91 7838065578