Javascript-Understanding prototype

1. prototype and [[prototype]

Prototype usually represents two concepts. The constructor has a common prototype attribute.

When the constructor is used to create a new object, a [[prototype] attribute is used as a reference to the prototype attribute of the constructor that creates the object.

The constructor has an internal [prototype] attribute, which is used as a reference to the prototype attribute of the constructor,

Generally, the function. Prototype attribute is referenced. In short, all JavaScript objects have an internal [prototype] attribute,

And only when this object is a function object, it also has the prototype attribute.

First, use new to create an object.

function Circle(radius) {    this.radius = radius;}var circ = new Circle(6);var circ2 = {radius: 6};

According to the concept of the prototype above:

[[Prototype] in the circle references object. Prototype

[[Prototype] in CIRC references circle. Prototype

Circ2 is a direct inheritance (that is, its [[prototype] attribute is a reference to object. Prototype)

2. constructor prototype

The function is always assigned a prototype attribute, and the [[prototype] attribute of all objects created by the constructor is set to this attribute.

The prototype of the prototype assigned by this function is object. Prototype. In addition, it defines a constructor attribute,

This attribute is a reference of the constructor itself. The new operator can be used in any expression and generate a constructor,

In this case, we can use this property to dynamically create objects of the same type as known objects.

var circ = new Circle(6);Circle.prototype.diameter = function() {    return this.radius * 2;}alert(circ.diameter()); // 12alert(Circle,circle.constructor);  // true

Here we have added the diameter Method for circle. prototype and passed the test. Some people are used to using the following method to add functions.

Circle. prototype = {diameter: function () {return this. radius * 2 ;}}var CIRC = new circle (6); // If the declared variable is placed before the prototype value, CIRC. diameter does not declare alert (CIRC. diameter (); // 12 alert (Circle, circle. constructor); // false

When we assign a new value to circle. prototype, JavaScript will no longer create constructor for this object

Attribute. This indicates that the [[get] of the constructor attribute will cause the interpreter to search along the prototype chain until the corresponding value is found.

In our constructor, the result of the constructor attribute search is object. prototype, while the latter's constructor attribute value is object.

The solution is to manually assign values to the constructor attribute.

Circle.prototype = {    constructor: Circle,    diameter: function() {            return this.radius * 2;    }}

3. instanceof

If the internal attribute [[prototype] of a or any object in its prototype chain is the same as B. prototype, true is returned for expression a instanceof B.

alert(circ instanceof Object );alert(circ instanceof Circle);alert(circ2 instanceof Object);