Prototypes allow objects in JavaScript to inherit features from one another. Every object possesses a unique quality known as a prototype.
A prototype has its own prototype because the prototype is also another thing. As a result, a prototype chain is created. When a prototype has null for its own prototype, the prototype chain comes to an end.
Because the quantity and complexity of our JavaScript used to be so small, we could previously ignore it with little to no repercussion.
However, with the advancement of browser technology, we now live in a world where complicated client-side behavior is expected, requiring much more work. We can no longer use SOLID programming techniques in our JavaScript when that complexity rises. Once you start working with JavaScript in a more object-oriented manner, several riddles will become evident. These mysteries can be solved by understanding prototypes.
Syntax:
Object.prototype
Example 1: In this example, the object gains a new property.
function Student(a, b) {
this.name = a;
this.id = b;
}
Student.prototype.age = 12;
const s1 = new Student("Dinesh", 1234567);
console.log(s1.name +
" is " + s1.age + " years old.");
Example 2: This example adds a new method to the object.
function Student(a, b) {
this.name = a;
this.id = b;
}
Student.prototype.details = function () {
return this.name + " " + this.id
};
let s1 = new Student("Dinesh", 1234567);
console.log(s1.details());
๐ Genealogy of the Prototype
Every JavaScript object derives its methods and attributes from a prototype:
Date and Array objects are descended from Date.prototype
and Array.prototype
, respectively.
Person prototypes are the ancestors of Person objects.
At the top of the prototype inheritance hierarchy is the Object.prototype
:
Person, Date, and Array objects all derive from Object.prototype
.
๐ Giving Objects Properties and Methods
There are occasions when you wish to give every object of a certain type that already exists new properties (or methods).
An object constructor may occasionally need to have new methods or properties added to it.
Top comments (0)