Here we discuss the relationship between the internal prototype (__PROTO__) of the object and the prototype (prototype) of the constructor.
__proto__ of all constructors/functions point to Function.prototype, which is an empty function (Empty function)
Copy Code code 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 a total of 12 built-in (build-in) constructors/objects in JavaScript (new JSON in ES5), and 8 constructors are listed here. Left as global cannot be accessed directly, arguments is created by the JS engine only when the function is called, and Math,json exists in the form of objects, without new. Their __proto__ is object.prototype. As follows
Copy Code code as follows:
math.__proto__ = = Object.prototype//True
json.__proto__ = = Object.prototype//True
The "all constructors/functions" mentioned above, of course, include customizations. As follows
Copy Code code 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 that mean?
All constructors come from Function.prototype, even the root constructor object and the function itself. All constructors inherit the properties and methods of the Function.prototype. such as length, call, apply, bind (ES5).
Function.prototype is also the only prototype that typeof Xxx.prototype as "function". The prototype of other constructors is an object. As follows
Copy Code code 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's also mentioned that it's an empty function, alert (function.prototype) to look under.
Knowing that all constructors (including built-in and custom) __proto__ are Function.prototype, who is Function.prototype __proto__?
I believe I have heard of the JavaScript function is also a first-class citizen, how can it be embodied? As follows
Copy Code code as follows:
Console.log (function.prototype.__proto__ = = = Object.prototype)/True
This shows that all constructors are also a normal JS object, you can add/remove attributes to the constructor, etc. At the same time it also inherited all the methods on the Object.prototype: toString, valueof, hasOwnProperty, etc.
Who was the last Object.prototype __proto__?
Copy Code code as follows:
OBJECT.PROTOTYPE.__PROTO__ = = NULL//True
Has peaked, is null.
The __proto__ of all objects points to the prototype of their constructors
It tests all the built-in constructors and the __proto__ of the custom constructor, and then look at the __proto__ of the instance objects of all these constructors.
First look at the JavaScript engine built-in builder
Copy Code code 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
Then look at the custom constructor, which defines a person
Copy Code code as follows:
function person (name) {
THIS.name = Name
}
var p = new Person (' Jack ')
Console.log (p.__proto__ = = = Person.prototype)/True
P is an instance object of person, and P's internal prototype always points to the prototype of its constructor person.
Each object has a constructor property that can get its constructor, so the following print results are identical
Copy Code code as follows:
function person (name) {
THIS.name = Name
}
var p = new Person (' Jack ')
Console.log (p.__proto__ = = = P.constructor.prototype)/True
The person above does not add a property or method to its prototype, adding a GetName method to its prototype
Copy Code code as follows:
function person (name) {
THIS.name = Name
}
modifying prototypes
Person.prototype.getName = function () {}
var p = new Person (' Jack ')
Console.log (p.__proto__ = = = Person.prototype)/True
Console.log (p.__proto__ = = = P.constructor.prototype)/True
You can see that both the p.__proto__ and the Person.prototype,p.constructor.prototype are identical, that is, they all point to the same object.
If you set up the prototype in a different way, the result is a little differently.
Copy Code code as follows:
function person (name) {
THIS.name = Name
}
Rewriting prototypes
Person.prototype = {
Getname:function () {}
}
var p = new Person (' Jack ')
Console.log (p.__proto__ = = = Person.prototype)/True
Console.log (p.__proto__ = = = P.constructor.prototype)//False
This directly rewrites the Person.prototype (note: The previous example is a modified prototype). The output shows that p.__proto__ still points to person.prototype, not p.constructor.prototype.
It's also very well understood that assigning a person.prototype to an object's direct volume {getname:function () {}}}, an object that is defined using the object's direct measure, whose constructor (constructor) points to the root constructor object, Object.prototype is an empty object {},{} naturally differs from {getname:function () {}}. As follows
Copy Code code as follows:
var p = {}
Console.log (Object.prototype)//is an empty object {}
Console.log (P.constructor = = = Object)//object direct quantity defined objects whose constructor is
Console.log (P.constructor.prototype = = = Object.prototype) is true and does not explain
The __proto__ used in the code above are not currently supported in IE6/7/8/9. Object.getprototypeof (ES5) can be used in IE9 to get an internal prototype of an object.
Copy Code code as follows:
var p = {}
var __proto__ = object.getprototypeof (P)
Console.log (__proto__ = = = Object.prototype)/True
