This is the 9th day of my participation in Gwen Challenge

Simple prototype chain idea

We know that most data types in JS are instances of the corresponding constructor, such as: An Object is an instance of Object, a Function is an instance of Function, a String is an instance of String, etc. These instances can inherit methods from their prototype via __proto__, with the corresponding constructor’s prototype pointing to the prototype and its constructor pointing to the constructor. So we can probably draw a “simple” generic prototype chain diagram:

Complete prototype chain idea

Prototype is specific to functions and __proto__ is specific to objects.

Constructors are both functions and objects, so constructors have both Prototype and __proto__, whereas protoobjects have only __proto__.

Now that we’ve looked at a simple prototype chain, you might wonder, since the constructor is a function that has both prototype and __proto__, where does the __proto__ of the Xx() constructor point? Any constructor is an instance of the Function class.

Xx() has two identities, one as a constructor and one as an instance of the Function class. As a constructor, its prototype already points to the prototype, and as an instance of the Function class, this constructor should also be an instance of the Function class. Something like the following:

Function is an object, so where does its __proto__ point to? The Function constructor is also a Function, like Xx(), which is an instance of a Function, so its __proto__ refers to the prototype of Function, as shown below:

So we get that all constructors are instances of the Function class, including the Function constructor itself, so we get that the Object constructor should also be instances of Function, Its __proto__ also points to the prototype for Function, as shown below (red line) :

The Object constructor, in turn, has its prototype and instance:

Finally, each prototype Object points to the prototype of Object, forming a prototype chain:

After we know the entire prototype chain, we can easily find the path of the prototype chain by looking at the diagram above (Xx() can be any constructor), such as:

Function.__proto__===Function.prototype;//true indicates that both sides point to the same address
String.prototype.__proto__ === Number.__proto__.__proto__;//true indicates that both sides point to the same address.Copy the code

instanceof

The main implementation of instanceof is as long as the prototype on the right is on the prototype chain on the left (note that the instanceof operator applies only to objects, not primitive values).

LeftVal. __ proto __. __ proto __...... === rightVal.prototypeFunction instanceof Object //true indicates that Function can find Object through the prototype chain
Copy the code

How is writing a method in a prototype different from writing a method in a constructor

  1. Writing methods in prototypes consumes less memory than writing them in constructors. Since there is only one stereotype of a class in memory, the behavior written in the stereotype can be shared by all instances. The instantiation does not duplicate the behavior in the instance memory, whereas the method written in the class is replicated in each instance, so the memory consumption is higher.

  2. Properties and methods defined in the constructor take precedence over those defined in the stereotype. If properties and methods with the same name are defined, the constructor overrides the properties and methods in the stereotype.