A deep understanding of the relationship between _ proto _ and prototype in JavaScript

Here we will discuss the relationship between the object's internal prototype (_ proto _) and the prototype of the constructor.
1. All Constructors/functions _ proto _ point to Function. prototype, which is an Empty function (Empty Function) Copy codeThe Code is as follows: Number. _ proto _ = Function. prototype/true
Boolean. _ proto _ = Function. prototype // true
String. _ proto _ = Function. prototype // true
Object. _ proto _ = Function. prototype // true
Function. _ proto _ = Function. prototype/true
Array. _ proto _ = Function. prototype // true
RegExp. _ proto _ = Function. prototype // true
Error. _ proto _ = Function. prototype // true
Date. _ proto _ = Function. prototype // true

There are 12 built-in (build-in) Constructors/objects in JavaScript (JSON is added in ES5). The eight constructors that can be accessed are listed here. For example, Global cannot be accessed directly. Arguments is only created by the JS engine during function calling. Math and JSON exist as objects without the need for new. Their _ proto _ is Object. prototype. As follows:Copy codeThe Code is as follows: Math. _ proto _ = Object. prototype // true
JSON. _ proto _ = Object. prototype // true

The "All Constructors/functions" mentioned above certainly include custom ones. As follows:Copy codeThe Code is as follows: // function declaration
Function Person (){}
// Function expression
Var Man = function (){}
Console. log (Person. _ proto _ = Function. prototype) // true
Console. log (Man. _ proto _ = Function. prototype) // true

What does this mean?
All constructors come from Function. prototype, and even include the root constructor Object and Function itself. All constructors inherit the attributes and methods of Function. prototype. Such as length, call, apply, bind (ES5 ).
Function. prototype is also the only prototype with typeof XXX. prototype being "function. The prototype of other constructors is an object. As follows:Copy codeThe Code is as follows: console. log (typeof Function. prototype) // function
Console. log (typeof Object. prototype) // object
Console. log (typeof Number. prototype) // object
Console. log (typeof Boolean. prototype) // object
Console. log (typeof String. prototype) // object
Console. log (typeof Array. prototype) // object
Console. log (typeof RegExp. prototype) // object
Console. log (typeof Error. prototype) // object
Console. log (typeof Date. prototype) // object
Console. log (typeof Object. prototype) // object

Oh, it is also mentioned that it is an empty Function. Let's take a look at alert (Function. prototype.
I know that all the Constructors (including built-in and custom) _ proto _ are Function. prototype. Who is the Function. prototype _ proto?
I believe I have heard that functions in JavaScript are also first-class citizens. How can they be reflected? As follows:Copy codeThe Code is as follows: console. log (Function. prototype. _ proto _ = Object. prototype)/true

This indicates that all constructors are also common JS objects, and you can add/delete attributes to the constructor. It also inherits all methods on Object. prototype: toString, valueOf, hasOwnProperty, and so on.
Who is the last Object. prototype _ proto?Copy codeThe Code is as follows: Object. prototype. _ proto _ = null // true

It has reached the top, and is null.
2. All object _ proto _ points to the prototype of its constructor.
We have tested the _ proto __of all built-in constructors and user-defined constructors. Let's look at the _ proto _ pointing to all the constructor instance objects?
Let's take a look at the built-in constructor of the JavaScript engine.Copy codeThe Code is as follows: var obj = {name: 'jack '}
Var arr = [1, 2, 3]
Var reg =/hello/g
Var date = new Date
Var err = new Error ('exception ')
Console. log (obj. _ proto _ = Object. prototype) // true
Console. log (arr. _ proto _ = Array. prototype) // true
Console. log (reg. _ proto _ = RegExp. prototype) // true
Console. log (date. _ proto _ = Date. prototype) // true
Console. log (err. _ proto _ = Error. prototype) // true

Let's look at the custom constructor. Here we define a PersonCopy codeThe Code is as follows: function Person (name ){
This. name = name
}
Var p = new Person ('jack ')
Console. log (p. _ proto _ = Person. prototype) // true

P is the Instance Object of Person. The internal prototype of p always points to the prototype of Person in its constructor.
Each object has a constructor attribute, which can be used to obtain its constructor. Therefore, the following printed results are also constant.Copy codeThe Code is as follows: function Person (name ){
This. name = name
}
Var p = new Person ('jack ')
Console. log (p. _ proto _ = p. constructor. prototype) // true

The Person mentioned above does not add attributes or methods to its prototype. Here, a getName method is added to its prototype.Copy codeThe Code is as follows: function Person (name ){
This. name = name
}
// Modify the prototype
Person. prototype. getName = function (){}
Var p = new Person ('jack ')
Console. log (p. _ proto _ = Person. prototype) // true
Console. log (p. _ proto _ = p. constructor. prototype) // true

We can see that p. _ proto _ and Person. prototype, p. constructor. prototype are consistent, that is, all point to the same object.
If you set the prototype in another way, the results will be somewhat different.Copy codeThe Code is as follows: function Person (name ){
This. name = name
}
// Rewrite the prototype
Person. prototype = {
GetName: function (){}
}
Var p = new Person ('jack ')
Console. log (p. _ proto _ = Person. prototype) // true
Console. log (p. _ proto _ = p. constructor. prototype) // false

The Person. prototype is directly rewritten here (note: the previous example is to modify the prototype ). The output shows that p. _ proto _ still points to Person. prototype, rather than p. constructor. prototype.
This is also very understandable, for Person. the prototype value is an Object's direct quantity {getName: function () {}}. The constructor of an Object defined using the Object's direct quantity method points to the root constructor Object, object. prototype is an empty object {},{}, which is different from {getName: function. As follows:Copy codeCode: var p = {}
Console. log (Object. prototype) // an empty Object {}
Console. log (p. constructor = Object) // The constructor of an Object is defined as an Object in the direct Object quantity mode.
Console. log (p. constructor. prototype = Object. prototype) // true.

The _ proto _ used in the above Code is currently not supported in IE6, 7/8, or 9. In IE9, you can use Object. getPrototypeOf (ES5) to obtain the internal prototype of an Object.Copy codeCode: var p = {}
Var _ proto _ = Object. getPrototypeOf (p)
Console. log (_ proto _ = Object. prototype) // true