1 Problems with constructors

The following code creates instance objects person1 and person2 using the constructor and new.

function Person() { this.age = age; This.say = function () {console.log(' I want to fly '); }; } var person1 = new Person(); var person2 = new Person();Copy the code

The constructor has a method called say() that is a complex data type, as shown in the figure below, which opens a new space each time it is called. Even though the instance object person1 and person2 call the same method, the same say() space has to be created, and a large number of instance objects will cause a large amount of memory waste.

2 Function of prototype object prototype

What is the prototype? Is an object.

What is the role of archetypes? Shared methods.

The prototype object solves the constructor problem by storing the constructor’s methods in the Prototype object. Different instance objects use say() when using say(), as shown in the figure below, which saves a lot of memory.

Object prototype __proto__ and constructor

Proty (3.1

Each instance object will have a __proto__ pointing to the constructor’s prototype object, so we can use properties and methods of the constructor prototype object via __proto__ of the instance object. As shown in the following code, the __proto__ object prototype is equivalent to the prototype object prototype.

function Person() {} var person1 = new Person(); console.log(Person.prototype === person1.__proto__); / / return trueCopy the code

3.2 the constructor

Both __proto__ and prototype objects have a constructor property, which we call a constructor because it refers back to the constructor itself. Constructor is used primarily to record which constructor the object refers to, and it can redirect the prototype object to the original constructor.

Note: it is modifiable and unreliable.

Constructor, instance object, prototype object relationship.

  • The object instance Person1 is created using the constructor Person and new.
  • Person1.__ptoto__ points to the constructor Person.prototype prototype object
  • The Constructor of Person.prototype points to the constructor Person

5 JS search mechanism

  • When accessing properties (including methods) of an object, you first look up whether the object itself has the properties.
  • If not, look for its prototype (that is, the prototype object __proto__ points to).
  • If not, find the prototype of the prototype Object (Object’s prototype Object).
  • And so on until Object is found (null).
  • The point of __proto__ object archetypes is to provide a direction, or a route, for the object member lookup mechanism.

6 prototype chain

According to the search mechanism, it is easy to figure out the prototype chain. It should be noted that:

  • In JS, a Function is an instance object of a Function, and all functions are constructed by Function.
  • Object. Prototype is the prototype of all objects (direct or indirect).

7. Particularity of Function and Object.

  • Function.__proto__ === function.prototype

  • Prototype === object.__proto__

  • Function.prototype.__proto__ === Object. Prototype === Object. Object.__proto__ === Function. Prototype = you are my Object, I am your Object.

  • The final prototype object belongs to objectobject.prototype. __proto__ === null