Published on

Object Prototype

4 mins

  • Name
    Juleshwar Babu

Table Of Contents

Source Link:

Prototypal inheritance

  • Link:

  • Prototypal inheritance is JS’ way of allowing an object to extend or inherit behaviour from another object.[[Prototype]] is a hidden internal object field which is used to enable this.

  • If a field doesn’t exist on an object, the JS engine follows the prototype chain to search for the field.

    let animal = {
        eats: true,
        walk() {
            alert("Animal walk");
    let rabbit = {
        jumps: true,
        __proto__: animal
    let longEar = {
        earLength: 10,
        __proto__: rabbit
    // walk is taken from the prototype chain
    longEar.walk(); // Animal walk
    alert(longEar.jumps); // true (from rabbit)
    Image showing how setting the __proto__ property of objectA to objectB links objectB as a parent of objectA in the prototype chain
  • There is another field __proto__ which exists for historical reasons. It is a historical getter/setter for [[Prototype]]. Modern JS way of getting/setting prototype is by using Object.getPrototypeOf(obj) / Object.setPrototypeOf(objA, objB)

  • In a method call, the value of this is always decided by the object behind the .(dot)… even if a method is found in the prototype chain

    let animal = {
    	run() {
    		this.isRunning = true
    let elephant = {
    	__proto__: animal
    elephant.isRunning // true
    animal.isRunning // undefined


  • Link:

  • We will be talking about the prototype object field here. We will be analysing the behaviour of literally setting the prototype property to a function.

  • Setting Animal.prototype = animal literally states, when a new object is created using new Animal, set its [[Prototype]] property to the animal. The "prototype" property only has such a special effect when set on a constructor function, and invoked with new. On regular objects the prototype is nothing special.

    let animal = {
      eats: true
    function Rabbit(name) { = name;
    Rabbit.prototype = animal;
    let rabbit = new Rabbit("White Rabbit"); //  rabbit.__proto__ == animal
    alert( rabbit.eats ); // true
    Image shows when the prototype property of functionB is set to objectA, any new instance created using new functionB will have its [[prototype]] set to objectA
  • Every function has a default prototype assigned to it

    function Test() {}
    // Test.prototype = { constructor: Test }
    Test.prototype.constructor === Test // true
    let testChild = new Test()
    testChild.prototype === Test.prototype
    testChild.constructor === Test
    Image shows how prototype, constructor and [[prototype]] are related

Native prototypes [TODO]

Prototype methods, objects without proto [TODO]

Content Updates

  • 2023-09-09 - init