This section briefly introduces the principle of the _ proto _ attribute in javascript, and javascript _ proto _

This section briefly introduces the principle of the _ proto _ attribute in javascript, and javascript _ proto _

In javascript, we will agree that if a method is used by a new method, the first letter of the method name is usually capitalized, such as the Person in the following code block. (We can also regard Person as a class in java or c)

var Person = function(name) {    this.name = name;}

The process of a class being new in javascript is as follows:

// Initialize an object pvar p = new Person ();

// Initialize an object pvar p ={}; p. _ proto _ = Person. prototype; Person. call (p );

The functions of the above two code segments are exactly the same. The key lies in the 2nd line of the 2nd code segment. Let's prove that:

var p = new Person();console.log(p.__proto__ ===  Person.prototype); // true

The true value returned by the above Code indicates that the code in section 2nd is correct.

So what is _ proto?

• Simply put, each object in javascript has a _ proto _ attribute. When we access an object's attribute, if this attribute does not exist inside the object, then he will go to _ proto _ to find this attribute, and this _ proto _ will have his own _ proto __, so he will keep searching like this, that is, the concept of prototype chain.

• According to the standard, __proto _ is not made public, but chrome's engine exposes it as a public attribute, and we can access and assign values to it. However, the ie browser cannot access this attribute, so it is not recommended that you directly operate this attribute to avoid browser compatibility problems.

The concept is clear. Let's look at the code section:

var Person = function() {};Person.prototype.say = function() {    alert("Person say");}var p = new Person();p.say(); // Person say

This code is very simple. I believe everyone has written it like this. Let's see why p can access the Person's say. It is equivalent to the following code:

var Person = function() {};Person.prototype.say = function() {    alert("Person say");}var p = {};p.__proto__ =  Person.prototype;Person.call(p);p.say(); // Person say

When we call p. when say (), p does not have the say attribute, so it is found in the _ proto _ attribute of p, that is, Person. prototype, And we define Person. prototype. say = function () {}; therefore, p is in Person. this method is found in prototype.
Process: p-> p. _ proto _ = Person. prototype

Next, let's look at a more complex code.

var Person = function() {};Person.prototype.say = function() {    console.log("Person say");}Person.prototype.salary = 50000;var Programmer = function() {};Programmer.prototype = new Person();Programmer.prototype.writeCode = function() {    console.log("Programmer writes code");};Programmer.prototype.salary = 500;var p = new Programmer();p.say(); // Person sayp.writeCode(); // Programmer writes codeconsole.log(p.salary); // 500

Let's not look at the following derivation process, but try to deduce it by yourself.

Var Person = function () {}; Person. prototype. say = function () {console. log ("Person say");} Person. prototype. salary = 50000; var Programmer = function () {}; Programmer. prototype = new Person (); // derivation process --> // Programmer. prototype = {}; // Programmer. prototype. _ proto _ = Person. prototype; // Person. call (Programmer. prototype); Programmer. prototype. writeCode = function () {console. log ("Programmer writes code") ;}; Programmer. prototype. salary = 500; var p = new Programmer (); // derivation process --> // var p = {}; // p. _ proto _ = Programmer. prototype; // p. _ proto _ = new Person (); // p. _ proto __. _ proto _ = Pserson. prototype; // Person. call (p. _ proto _); // Programmer. call (p); p. say (); // Person sayp. writeCode (); // Programmer writes codeconsole. log (p. salary); // 500.

When we call p. when say (), p does not have the say attribute, so it is found in the _ proto _ attribute of p, that is, Programmer. prototype. In this case, Programmer. prototype is equal to new Person (), but there is no say attribute in new Person (), so it goes to new Person (). _ proto _. new Person (). _ proto _ equals to Pserson. prototype. We define Person. prototype. say = function () {}; therefore, p is in Person. this method is found in prototype.
Process:
P->
P. _ proto _ = Programmer. prototype = new Person ()->
P. _ proto __. _ proto _ = Programmer. prototype. _ proto _ = new Person (). _ proto _ = Pserson. prototype

Calling p. writeCode () and p. salary are the same principle. You can deduce it yourself.

As long as you understand the following code, you can easily master the knowledge of the javascript prototype chain.

Var Person = function (name) {this. name = name;} // Initialize an object pvar p = new Person (); // derivation process --> // var p = {}; // p. _ proto _ = Person. prototype; // Person. call (p );

References: Some Understandings about _ proto _ and prototype