__proto__ of all constructors/functions point to Function.prototype, which is an empty function
123456789 |
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 is a total of 12 built-in (build-in) constructors/objects in JavaScript (new JSON in ES5), and 8 constructors are listed here. As the rest of the global cannot be accessed directly, arguments is only created by the JS engine when the function is called, and Math,json exists as an object without new. Their __proto__ are object.prototype. As follows
12 |
Math.__proto__ === Object.prototype // true JSON.__proto__ === Object.prototype // true |
The "all constructors/functions" mentioned above certainly includes a custom. As follows
123456 |
// 函数声明 function Person() {} // 函数表达式 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
12345678910 |
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, the above also mentions that it is an empty function, alert (function.prototype) look under.
Knowing that all constructors (with built-in and custom) __proto__ are Function.prototype, who is Function.prototype __proto__?
I believe I have heard that the function in JavaScript is also a class citizen, where can it be manifested? As follows
1 |
console.log(Function.prototype.__proto__ === Object.prototype) // true |
This means that all constructors are also a common JS object, which can add/remove attributes to the constructor, and so on. It also inherits all the methods on Object.prototype: ToString, ValueOf, hasOwnProperty, and so on.
Who was the last Object.prototype __proto__?
1 |
Object.prototype.__proto__ === null // true |
has been to the top, null.
The __proto__ of all objects point to the prototype of their constructors
The above tests all the built-in constructors and the __proto__ of the custom constructors, and then look at who the __proto__ of all the instance objects of these constructors point to?
First look at the JavaScript engine built-in constructor
1234567891011 |
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, where a person is defined
12345 |
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 the internal prototype of P 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 also identical
12345 |
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, which adds a GetName method to its prototype
12345678 |
function
Person(name) {
this
.name = name
}
// 修改原型
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 p.__proto__ and person.prototype,p.constructor.prototype are identical, meaning they all point to the same object.
If you set up a prototype in a different way, the result is a little differently.
12345678910 |
function
Person(name) {
this
.name = name
}
// 重写原型
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 rewritten directly here (note: The previous example was to modify the prototype). The output shows that p.__proto__ still points to person.prototype, not p.constructor.prototype.
It's also good to understand that assigning a value to Person.prototype is an object with a direct amount of {getname:function () {}}, an object whose constructor (constructor), which is defined using the object's direct amount, points to the root constructor object, Object.prototype is an empty object {},{} is naturally not equal to {getname:function () {}}. As follows
1234 |
var p = {} console.log(Object.prototype) // 为一个空的对象{} console.log(p.constructor === Object) // 对象直接量方式定义的对象其constructor为Object console.log(p.constructor.prototype === Object.prototype) // 为true,不解释 |
The __proto__ used in the above code is currently not supported in IE6/7/8/9. You can use Object.getprototypeof (ES5) in IE9 to get an internal prototype of an object.
123 |
var p = {} var __proto__ = Object.getPrototypeOf(p) console.log(__proto__ === Object.prototype) // true |
The relationship between __proto__ and prototype in JavaScript