JS prototype, prototype chain deep understanding of _javascript skills

prototype is a more difficult to understand the concept of JavaScript, the prototype related to more properties, the object has "prototype" attribute, the function object has "prototype" attribute, the prototype object has "constructor" attribute.

First, the initial knowledge of the prototype
in JavaScript, a prototype is also an object that implements the object's property inheritance through a prototype, and the JavaScript object contains a "[[Prototype]]" intrinsic property that corresponds to the object's prototype.
' [[[Prototype]] ' is an object's internal property and cannot be accessed directly. So in order to easily see the prototype of an object, Firefox and Chrome provide the __proto__ (not all browsers support) accessors (ECMA introduces the standard object prototype accessor "Object.getprototype (object)" ）。 In the JavaScript prototype object, there is also a "constructor" attribute that corresponds to the constructor that creates all instances that point to the prototype

Second, the rules
In JavaScript, each function has a prototype property, and when a function is used as a constructor to create an instance, the prototype property value of the function is assigned as a prototype to all object instances (that is, the ' __proto__ ' attribute of the set instance). That is, the prototype of all instances refers to the prototype property of the function. (* * * * * Only function objects will have this attribute! ' * * * * * *)

The new process is divided into three steps

var p = new Person (' John ', 20);

1. Var p={}; Initializes an object p.
2. P._proto_=person.prototype, set the __proto__ property of the object p to Person.prototype
3. Person.call (P, "John", 20); Call constructor person to initialize p. About call/apply Use

Three, the first knowledge of the object
object is itself a function object. (CODE TEST) since it is an object function, there must be a prototype property, so you can see that the value of "Object.prototype" is the prototype object of "object {}". Conversely, when you access the "constructor" property of the "Object.prototype" object, you get the OBEJCT function.
In addition, when you get the prototype of the object prototype through "Object.prototype._proto_", you get "null", which means that the "object {}" prototype object is the end of the prototype chain.
Iv. early recognition of function
as in the example above, the function in JavaScript is also an object, so you can find the prototype of the constructor object by _proto_.
The function object, as one of the functions, has a prototype property that corresponds to the function () {} object.
Function object as an object, there is a __proto__ attribute, which corresponds to "Function.prototype", that is to say, "function._proto_ = = Function.prototype".

Here is a brief introduction to "prototype" and "Proto":
For all objects, there is the __proto__ attribute, which is the prototype of the object.
For function objects, there are prototype properties in addition to the __proto__ property, and when a function is used as a constructor to create an instance, the prototype property value of the function is assigned as a prototype to all object instances (that is, setting the __proto__ property of the instance).

Prototype chain structure diagram

Prototype chain
because each object and prototype has a prototype, the object's prototype points to the prototype object,
And the father's prototype points to the father's father, this prototype layer connected to form the prototype chain.

One, property lookup
When a property of an object is looked up, JavaScript traverses the prototype chain up until it finds the property of the given name, until it reaches the top of the prototype chain (i.e. Object.prototype), and returns undefined if the specified attribute is still not found.

function person (name, age) { 
    this.name = name; 
    This.age = age; 
  } 
Person.prototype.MaxNumber = 9999;
person.__proto__. Minnumber = -9999;
var would = new person ("would"); 
Console.log (would. MaxNumber); 9999 
Console.log (would. Minnumber); Undefined 

In this example, the "MaxNumber" and "Minnumber" attributes were added to both the "Person.prototype" and "Person.proto" prototypes, and the distinction between "prototype" and "Proto" needs to be clarified.

"Person.prototype" corresponds to the prototype of all instances constructed by person, meaning that "person.prototype" is part of the prototype chain of these instances, so when these instances are searched for attributes, they refer to the " Person.prototype the property in the.

How object creation affects prototype chains

  var July = { 
    name: "John", 
    age:28, 
    getinfo:function () { 
      Console.log (this.name + "is" + This.age + "Years") Old "); 
    } 
 Console.log (July.getinfo ()); 

When you create an object in this way, the prototype chain becomes the following diagram. The prototype of the July object is "Object.prototype", which means that the way the object is constructed affects the form of the prototype chain.

{} object prototype chain structure diagram

As described in the comprehensive picture
1. All objects have the __proto__ attribute, which is the prototype of the object.
2. All function objects have prototype properties, and the value of the property is assigned to the 3 created by the function. The _proto_ attribute of the image.
4. All prototype objects have constructor properties that correspond to the constructor that creates all instances that point to the prototype.
5. Function objects and prototype objects are interconnected by prototype and constructor properties.

The above will be about the JS prototype, prototype chain details of the introduction, I hope to help you learn.