I spent a lot of time to learn the prototype chain before, I thought I understood it at that time, but recently I found that I didn’t understand it deeply enough. I borrowed two interview questions to review prototype and __proto__

The interview questions a

var a = {}
var b = Object.prototype

console.log([a.prototype === b, Object.getPrototypeOf(a) == b]);
Copy the code

Correct answer: [false, true]

The interview questions 2

function f() {}
var a = f.prototype 
var b = Object.getPrototypeOf(f); 

console.log(a === b); 
Copy the code

Correct answer: False

__proto__

Properties unique to the object

Object.getprototypeof (); object.getPrototypeof ()

The object.getProtoTypeof () method returns the Prototype of the specified Object (the value of the internal [[Prototype]] property).

[[Prototype]] is __proto__

So object.getProtoTypeof () returns the prototype of an Object (function is also an Object), that is __proto__ refers to the prototype of the Object

Note: A prototype is an object, other articles and books are mostly interpreted as a prototype object, the following is easy to explain, all called a prototype object

prototype

  1. Prototype is a property unique to the function, function. Prototype represents the prototype of the object

  2. When a constructor creates an instance object, that is, when it performs a new operation, it points the __proto__ of the instance object to the constructor’s Prototype property

    function F() {}
let f = new F()
f.__proto__ === F.prototype
Copy the code

  3. Therefore, when we define attributes or methods on the prototype of the instance object (i.e. Function.prototype), the instance object will look for its prototype if it cannot find the corresponding attributes or methods

The illustration

Combining the above analysis we can get the following illustration

Take the function F and the instance object F for example

In summary, an instance object created by a constructor has a prototype that points to the prototype represented by the constructor’s Prototype property

So since the prototype of an instance object is provided by the prototype property of its constructor, who provides the prototype of the constructor?

答案 : Function. Prototype

Function.prototype

Get the prototype of the constructor from Object.getProtoTypeof ()

So in other words

Function. __proto__ === function.prototype

Completion diagram

Combined with the new operator, I think that constructors are really tools, while stereotypes are not exactly classes, and that constructors are just Bridges between instance objects and stereotypes.

In the class-instance relationship of an object-oriented language, all attributes and methods of an instance come from the class, and the instance cannot add attributes or methods dynamically

In JavaScript’s constructor, stereotype, and instance relationship, the constructor and stereotype can specify the initial properties and methods of the instance object, and can add properties or methods dynamically

It’s interesting that JavaScript uses objects to simulate classes

Analyzing interview questions

After the above analysis to see the interview questions, in fact, has been at a glance

var a = {}
var b = Object.prototype

console.log([a.prototype === b, Object.getPrototypeOf(a) == b]);
Copy the code

[false, true] [false, true] [false, true] [false, true] [false, true] [false, true]

function f() {}
var a = f.prototype 
var b = Object.getPrototypeOf(f); 

console.log(a === b); 
Copy the code

A = the prototype of the constructor new, b = the prototype of the constructor new, so false

Please correct the error 😊