prototype and __proto__

Every object in javascript has a __proto__ property. The value of __proto__ is the prototype property of its construction function, or null if the object is not constructed by a construction function(such as Object.prototype.__proto__). Everything in javascript is an object including function. A function’s (such as Person()) __proto__ property is Function.prototype, which is int turn constructed using Object as the prototype so Function.prototype.__proto__===Object.prototype. Object is an object meanwhile a function so Object.__proto__===Function.prototype. Let’s see the following example:

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
  </head>
  <body>
    <script>
    function Person()
    {

    }
    var person=new Person();
    console.log("person.__proto__:",person.__proto__);
    console.log("Person.prototype:",Person.prototype);
    console.log("person.__proto__===Person.prototype:",person.__proto__===Person.prototype);
    console.log("Person.__proto__:",Person.__proto__);
    console.log("person.prototype:",person.prototype);
    console.log("Person.prototype.prototype:",Person.prototype.prototype);
    console.log("Person.prototype.__proto__:",Person.prototype.__proto__);
    console.log("Object.prototype:",Object.prototype);
    console.log("Person.prototype.__proto__===Object.prototype:",Person.prototype.__proto__===Object.prototype);
    console.log("Object.prototype.__proto__:",Object.prototype.__proto__);
    console.log("Object.prototype.prototype:",Object.prototype.prototype);
    console.log("Object.__proto__:",Object.__proto__);
    console.log("Number(1).__proto__:",Number(1).__proto__);
    console.log("Number.prototype:",Number.prototype);
    </script>
  </body>
</html>

The output is:

When searching for a property in an object and the object itself has not the property, it will look up the property in the __proto__ property of the object(which is the prototype of the construct function). This lookup process continues until the __proto__ is null(in the Objet.prototype). If the property is still not found, it is an “undefined” property. In the above example, person.prototype is an undefined property. A function’s “prototype” property always exists, and its constructor property is the function itself.

An object only inherits the properties from the property property of its constructing function, not from other properties of its constructing function. In a constructing function, you can use “this.someprop=xxx” to add a property to the object being constructed. Because this represents the object being constructed, the property is added to the object constructed by the construction function, not the construction function itself. You can add a property into the property property of the construction function(even after the object was created), which can be gotten by the objects created by the construction function using the new keyword.

reference

Did you like this?
Tip admin with Cryptocurrency