JavaScript prototype and prototype chain

Prototypes and prototype chains are a magical thing in javaScript. They are also the most difficult part for most people to understand. Mastering the essence of prototypes and prototype chains is an important part of javaScript advanced. Let me share my understanding of javascript prototype and prototype chain.

1. Object classification

We believe that any value or variable in JavaScript is an object, but I also need to classify objects in javaScript into the following levels.
  First of all, Object is a top citizen, this should be no doubt, because all objects are derived indirectly or directly through it. Function is a first-class citizen, explained below. Several built-in objects like String, Array, Date, Number, Boolean, Math, etc. are second-class citizens. The rest are all low-level citizens.

Second, the prototype prototype

First, prototype is an attribute, and it is also an object. So what are the properties of prototype? In fact, all functions in javascript have a prototype property, and in turn all objects with prototypes are themselves functions, and yes, they are functions.
  I will not confirm the first one, mainly look at the second one. Everyone knows that Object, Array, and Date all have prototypes. Are they functions? Yes, they are also a kind of function, why do you say that? When we define an object or an array, can we do so var o = new Object (), a = new Array (). Everyone who has learned java knows that new uses the method of instantiating an object, but we all know that there is no concept of a real class in JavaScript, so we can only use functions to simulate, then since the above approach can be confirmed Object and Array are also special functions.
  In fact, the citizens mentioned above are basically a kind of function. Except for the tool object of Math, you should not have seen this new Math () writing method! Of course, this writing method will also report an error, so when you visit Math.prototype, it returns undefined.

Three, __proto__ and prototype chain

__proto__ is a pointer, it refers to the prototype of the object that constructs its object, and it sounds like a mouthful. Give an example!
  Insert picture description here
  As in the above code, o is an instance of Object, so the __proto__ pointer of o points to the prototype of the Object that constructed o. The significance of this is that o can use the methods in Object.prototype, such as toString (), o will first look for itself when accessing the toString method, if not found, it will be searched on __proto__, which is Object.prototype.
  It can be said that almost all javascript objects have such a pointer as __proto__ including Object. Let's take
Insert picture description here
a look. In fact, a = 1 is equivalent to a = new Number (1). You can see that all the built-in objects and Object's __proto__ point to an anonymous function, so you can think that they are actually an instance of function, so I said before that function is a first-class citizen.

So what exactly is the prototype chain? We expand a .__ proto__ which is the Number.prototype object, it does not have toString () method, but for a it can actually call toString method, this is the role of the prototype chain. Look at the following code
  Insert picture description here
  Look at the above code and results, we will continue to visit the prototype of the Object along the __proto__ of a, which means that the toString method of a is actually the toString method of the Object.prototype. Then the prototype chain of a is composed of Number.prototype and Object.prototype. When a accesses a method or property, it will first look in itself, and then find it along the prototype chain. If it finds, it will be called. If it is not found, it will report an error. To confirm this, we add a toString method on Number.prototype.
  Insert picture description here
  You can see that a calls the toString method of Number.prototype, and stops after finding it. In JavaScript, the end point of the prototype chain of almost all objects is Object.prototype

to sum up

__proto__ is the key to realize the prototype chain, and prototype is the composition of the prototype chain. Finally, attach a slightly complicated relationship diagram between the prototype chain and the constructor. If you are interested, you can study it.
  Insert picture description here
  Reprinted from: https://www.cnblogs.com/alichengyin/p/4852616.html

Published 40 original articles · won 31 · views 2789

Guess you like

Origin blog.csdn.net/CodingmanNAN/article/details/103000768