Prototype

Every object in javascript has a built-in property called prototype.
We know javascript most things are objects. Nearly all "objects" in javascript are an instance of Object (global Object). And therefore all objects in javascript inherits property from the "Object" properties including methods). Because of that all objects in javascript will have inherit a property Object.prototype. And all those Object inherited properties will be listed inside the Object.prototype.

The property of an object that points to its prototype is often called __proto__ , But the standard way to access an object's prototype is by "Object.getPrototypeOf()" method

Every object will have its own datatype inherited properties inside the prototype, apart from that they will have the inherited properties from global javascript "Object".But these parent inherited properties will be shown at a new prototype level below the datatype inherited properties. The datatype inherited properties will differ with different datatypes but the Object inherited properties remain the same for all javascript objects.

For better visual understanding lets consider the below code on browser console :

the above array in the browser console will give:

So as expected, the console shows the array elements along with its array properties length. But we can also see a prototype object that is inherited from Array.prototype. Array.prototype contains all the Array inherited methods. (see below)

We can also see that Array.prototype has another prototype in it which is Object.prototype.(See below)

every object in javascript will have a property Object.prototype by default since every object is an instance of Object. Anf further down Object.prototype will not have any more prototypes.

Not just that, additional features can also be injected into an object using the prototype.

Array.prototype.methodName = function() {
, , , , ,
}
This lets you directly inject a new property(feature) into an existing Array object. (that is Array.prototype)

This "methodName" property will be only available to all Array objects that will be created.

Object.prototype.methodName = function() {
, , , , ,
}

This lets you inject a new property(feature) into Object.prototype.

/This "methodName" property will be available to all objects that will be created.

Prototype Chaining

We now know every object in javascript has a built-in property called prototype. But the prototype itself is an object, o the prototype will have its own prototype. The chain ends when it reaches a prototype that has null for its own prototype.

When you try to access a property of an object. If the property can't be found in the object itself, the prototype is searched for the property. If the property still can't be found, the prototype's prototype is searched for the property. and so on. Until either the property is found or the chain end is reached

In addition to the default inheritance of properties from global Object, It also lets you inherit properties from other javascript objects.This properties of the inherited object will be present as prototypes, and it will be chained with another prototype containing the Object inherited properties.

different syntaxes are used to chain prototypes.

const User = {
    name: "top name",
    email: "topuser@gmail.com"
}
const userSupport = {
    isAvailable: false,
    __proto__:User
}// adding user object into prototype of user


 // -----------different syntax---------------
 userSupport.__proto__ = User
 //ading user object into prototype of teachingSupport

 //modern syntax
Object.setPrototypeOf(userSupport,User)
 //ading user object into prototype of teachingSupportSupport

##