A picture of the relationship between function and object and a brief description of the instanceof operator

I was writing an illustration of the difference between prototype and __proto__, the search data found an interesting phenomenon, the following two operations return the same result:

instanceof Object; // true instanceof Function; // true

What is this about? To start with the operator, instanceof.

What is instanceof, or what is an operation?

I had a simple understanding that instanceof just detects if an object is a new instance of another object (such as var a = new Object (), a Instanceof object returns True), but the actual instanceof is more complex than this.

First of all, there are official explanations on the web (portals, interested students can go to see), but as always, so that people can not understand clearly at a glance ...

It seems that some of my classmates have interpreted this interpretation into a language that adults can read (portals) and seem to understand something:

// Suppose the instanceof operator is L on the left and R on the right instanceof  //instanceof operation, through the determination of the prototype chain L r.prototypel.__proto__.__proto__ ... = = =  R.prototype?  //Returns True if present returns false otherwise

Note: The instanceof operation will recursively find the prototype chain of L, i.e. l.__proto__.__proto__.__proto__.__proto__ ... Until the top level is found or found.

So one sentence to understand instanceof's arithmetic rules are:

instanceof detects if there is a prototype prototype on the right side of the __PROTO__ prototype chain on the left.

The relationship between the graphical constructor function and object

Let's take a look at the code and see:

//the constructor for the ① constructor function is its ownfunction.constructor=== Function;//true//the constructor of the ② constructor object is a function (so that the constructor of all constructors point to function)Object.constructor = = = Function;//true//the __proto__ of the ③ constructor function is a special anonymous function () {}Console.log (function.__proto__);//function () {}//④ The __proto__ of this particular anonymous function points to the prototype prototype of object. function.__proto__.__proto__ = = = Object.prototype//true//The __proto__ of ⑤object points to the function prototype, which is the special anonymous function described above ③.object.__proto__ = = = Function.prototype;//trueFunction.prototype = = = function.__proto__;//true

Third, when the constructor object and function encounter instanceof

We look back at the first part of the "strange phenomenon," from the above figure we can see:

function.__proto__.__proto__ = = = Object.prototype; // true object.__proto__ = = = Function.prototype; // true

So look back to the 1th we call the instanceof operation rules, function instanceof object and object instanceof function operation result of course is true!

If you look at the above, you still feel the above relationship is dizzy, just remember the following two most important relationships, other relationships can be deduced:

1, all the constructor of the constructor point to function

2, function of the prototype point to a special anonymous function, and this special anonymous function __proto__ point to Object.prototype

As for how the relationship between prototype and __proto__ is deduced, you can refer to my previous blog, "Three images of JavaScript prototype objects and prototype chains"

A picture of the relationship between function and object and a brief description of the instanceof operator