Will want to waste, will be solid xing; Take what you want and hold on to it. — Tao Te Ching
JavaScript Prototype Series (I) Constructors, prototypes, and prototype chains
What is Prototype Inheritance
Function, Object, Null, etc
Introduction to the
You basically know that the end of the prototype chain points to NULL, __proto__, Object. Prototype, null, function.prototype. __proto__, Object. __proto__, Function, Object What? Let’s take our time.
Object
The Object constructor creates an Object wrapper. All objects in JavaScript come from Objects; All objects inherit methods and properties from Object.prototype, although they may be overridden.
When Object is used as a constructor, its [[Prototype]] internal property values point to function.prototype
Object.__proto__ === Function.prototype; // true
Copy the code
Object.prototype
Object. Prototype Specifies the prototype Object. The [[prototype]] attribute is null, and the accessor attribute __proto__ exposes the interior of an Object. Object. Prototype is an Object created by the ECMAScript specification at the bottom of the browser.
object
Instantiate an object with a literal whose __proto__ refers to Object.prototype.
var obj = {};
obj.__proto__ === Object.prototype; // true
Copy the code
Instantiate an Object with its __proto__ pointing to Object.prototype.
var obj = new Object;
obj.__proto__ === Object.prototype; // true
Copy the code
Function
Excerpts from ECMAScript 5.1 specification
An instance of the standard built-in constructor Function, and can be called as a subroutine. Note: In addition to having named attributes, functions also contain executable code, state, which determines how they will behave when called. Function code is not limited to ECMAScript.
The Function constructor creates a new Function object. In JavaScript every Function is actually a Function object.
Function.prototype
A global Function object has no properties and methods of its own, but since it is a Function itself, it inherits some properties and methods from function.prototype via the prototype chain. Prototype is also a “Function Object” whose [[prototype]] internal property values point to Object.prototype.
Prototype’s [[Class]] attribute is Function, so this is a Function, but not the same.
Function.prototype; ƒ () {[native code]}
Function.prototype.prototype; // undefined
Copy the code
Function objects created with function.prototype. bind have no prototype properties.
let foo = Function.prototype.bind();
foo.prototype; // undefined
Copy the code
Function. The prototype is a Function of engine is created, the engine that does not need to add the prototype to the Function object attributes, or the Function. The prototype. The prototype… It would be endless and meaningless.
Function.prototype.__proto__ points to Object.prototype.
Function.prototype.__proto__ === Object.prototype; // true
Copy the code
Function.proto
The Function constructor is a Function object whose [[Class]] property is Function. Function’s [[Prototype]] property points to function. Prototype, i.e
Function.__proto__ === Function.prototype; // true
Copy the code
function
Instantiate a Function whose __proto__ points to function. prototype.
function foo () {}
foo.__proto__ === Function.prototype; // true
// foo.__proto__ => Function.prototype => Function.prototype.__proto__ => Object.prototype => Object.prototype.__proto__ => null
Copy the code
The chicken and egg problem of Object and Function
After the above elaboration of Object and Function, several problems are extended as follows:
-
When null is dropped on the prototype chain, the end of the prototype chain (root) is Object.prototype. All objects inherit properties from Object.prototype.
-
Function.prototype and function. __proto__ are the same object.
This means:
Object/Array/String
, etc.The constructorIn essence,Function
Be inherited fromFunction.prototype
. -
Prototype directly inherits root (object.prototype).
// Function. Prototype inherits Object. Prototype
Function.prototype.__proto__ === Object.prototype; // true
Function.prototype instanceof Object; // true
Function.prototype instanceof Function; // false
// Object Array Function and other constructors inherit function.prototype
Function instanceof Function; // true
Array instanceof Function; // true
Object instanceof Function; // true
Function instanceof Object; // true
Copy the code
By the above code know inherited prototype chain is roughly: Object. The prototype (root) < – Function. The prototype < – Function | Object | Array… .
One of the odder phenomena is as follows:
- The first question
Function.__proto__ === Function.prototype;
Copy the code
Is a Function object an instance created by the Function constructor?
- The second question
Function instanceof Object; // true
Object instanceof Function; // true
Object instanceof Object; // true
Function instanceof Function; // true
Copy the code
Function instanceof Object is true, and Object instanceof Function is true.
answer
Function. Prototype (); Object ();
Function.prototype
Is a function (object) that is different from a normal function (object).
The Function prototype object is itself a Function object (its [[Class]] is “Function”) that, when invoked, accepts any arguments and returns undefined. The value of the [[Prototype]] internal property of the Function prototype Object is the standard built-in object prototype object (15.2.4). The Initial value of the [[Extensible]] internal property of the Function prototype object is true. The Function prototype object does not have a valueOf property of its own; however, it inherits the valueOf property from the Object prototype Object.
The above can be summarized as:
-
Function. Prototype can be called like a normal Function, but always returns undefined.
-
Normal functions are actually instances of Function, i.e. normal functions inherit from function.prototype. Func. __proto__ = = = the Function prototype.
-
Prototype inherits from Object.prototype and does not have the prototype property. Func. The prototype is ordinary objects, the Function prototype. The prototype is null.
-
Function. Prototype is an alternative Function that precedes Function independently of /.
-
Function. __proto__ is Function. Prototype.
The value of the [[Prototype]] internal property of the Object constructor is the standard built-in Function prototype object. The value of the [[Prototype]] internal property of the Object prototype object is null, the value of the [[Class]] internal property is “Object”, and the initial value of the [[Extensible]] internal property is true.
The first question
Is a Function object an instance created by the Function constructor?
Yes part: according to the definition of “instance” in JavaScript, a is an instanceof b, i.e. a instanceof b is true. The default judgment condition is that b.prototype is on the prototype chain of a. Function instanceof Function = true; object.getProtoTypeof (Function) == Function. Prototype
The No part: Function is a built-in object, so there is No such thing as a “Function object created by the Function constructor”. In fact, when you write a function directly (such as function f() {} or x => x), there is no function constructor to call, Only when the Function constructor is explicitly called (e.g. New Function(‘x’, ‘return x’)).
Function. Prototype all constructors are integrated into Function. Prototype. So function.__proto__ === function.prototype.
The second question
// function.__proto__ and function. prototype refer to the same Object, function.prototype. __proto__ refer to object. prototype
// Function.__proto__ => Function.prototype.__proto__ => Object.prototype => Object.prototype.__proto__ => null
Function instanceof Object; // true
// Object as a constructor inherits from function. prototype
// Object.__proto__ => Function.prototype
Object instanceof Function; // true
Prototype; Function. Prototype__proto__ points to object. prototype
// Object.__proto__ => Function.prototype => Function.prototype.__proto__ => Object.prototype
Object instanceof Object; // true
// the Function constructor also inherits from function.prototype
// Function.__proto__ => Function.prototype
Function instanceof Function; // true
Copy the code
To sum up: Prototype (the top of the prototype chain), Function. Prototype is derived from Object. Prototype. Function and Object and other constructors derive from function. prototype.
conclusion
Object.prototype
Is the underlying browser basisECMAScript
An object created by the specification.Function.prototype
Directly inheritedObject.prototype
Again, it is a function created by the engine, which does not think it needs to be added to this function objectprototype
Properties.Function.prototype.prototype
forundefined
.- To have a first
Object.prototype
(Top of prototype chain),Function.prototype
inheritanceObject.prototype
And finally,Function
和Object
And other constructorsFunction.prototype
And produce.
reference
MDN Object.prototype
MDN Function.prototype
Get a deep understanding of JS objects and prototype chains from __proto__ and Prototype
From the probe into the Function.proto===Function. Prototype procedure
[Advanced 5-3] Further explore the Function & Object egg problem