Ambiguous relationship between the JavaScript prototype chain and the instanceof Operator

Ambiguous relationship between the JavaScript prototype chain and the instanceof Operator

Two months ago, the prototype chain, prototype, and _ proto _ had a messy relationship. At the same time, I also briefly understood the typeof and instanceof operators. However, anyway, try the following two questions:

Console. log (Function instanceof Function );
Console. log (String instanceof String );

If you cannot get an accurate answer, follow the story of the landlord to learn new things.

Temperature

We often use the typeof operator to determine the type of a variable. It is quite helpful to determine the number, boolean, and string types, but the object judgment capability is average, for example, the results of Array and null are all objects, and the results of some new objects, such as new String () and new Number (), are all objects. In this way, there is a problem, instanceof cannot be used to determine object instances in more detail. Gu mingsiyi, instanceof is an operator used to determine whether an object is an constructor instance. In this way, whether the new variable is a number, string, or something else, now we have a further understanding of the judgment. It looks very simple. In fact, the above two questions are just a small test. Put them first, and then review the prototype chain.

In JavaScript, everything is an object, and all objects have a _ proto _ property value (prototype). It may not be supported by some browsers, the attribute value of an object is the prototype value of the constructor of the object. The function is to define a method for an object of a certain type without repeating the definition. For example, for an object [1, 2, 3], obviously this is an Array object. It has pop, push, and other methods, but it does not mean that it has these methods, but it is owned by its constructor Array Function, the value of _ proto _ of this object is the prototype value of the Array function. If so does not have a pop method, It will be searched from its _ proto, that is, the so-called prototype chain, and the end of the chain is the Object, because all objects are constructed by the Object, and the Object. prototype. _ proto _ specifies to point to null.

Text descriptions are always pale and powerless. For example:

 
 

  
  
var fun = function(){ 
  
  
  this.a = 1; 
  
  
}; 
  
  
  
  
  
fun.prototype.b = 2; 
  
  
var obj = new fun(); 
  
  
obj.a; //1 
  
  
obj.b; //2 

 
 

The examples and figures of online piracy are as follows.

Zhixin

Next let's take a look at the instanceof operator.

The conventional usage of instanceof is to determine whether a is of the B type:

 
 

  
  
console.log(true instanceof Boolean); // false  
  
  
console.log(new Number(1) instanceof Number); // true 
 
 

Instanceof can also determine the parent type:

 
 

  
  
function Father() {} function Child() {} Child.prototype = new Father(); var a = new Child(); console.log(a instanceof Child);  // true 
  
  
console.log(a instanceof Father); // true 
 
 

The Child constructor inherits from Father. instance a is constructed by Child, but why is it also a Father instance? In fact, the kernel of the instanceof operator can be described in the following code:

 
 

  
  
function check(a, b) {   while(a.__proto__) {     if(a.__proto__ === b.prototype)       return true;     a = a.__proto__;   }   return false; } function Foo() {} console.log(Object instanceof Object === check(Object, Object)); // true 
  
  
console.log(Function instanceof Function === check(Function, Function)); // true 
  
  
console.log(Number instanceof Number === check(Number, Number)); // true 
  
  
console.log(String instanceof String === check(String, String)); // true 
  
  
console.log(Function instanceof Object === check(Function, Object)); // true 
  
  
console.log(Foo instanceof Function === check(Foo, Function)); // true 
  
  
console.log(Foo instanceof Foo === check(Foo, Foo)); // true 
 
 

Simply put, if a is an instance of B, a will certainly be able to use the methods and attributes defined in prototype of B, so it is indicated by code that the prototype chain of a contains B. the prototype has the same value, so you can find the same prototype in the prototype chain of.

In addition, String Number Boolean and Function are all functions, while functions are constructed by functions in a unified manner. so they are the same as any simple functions, you can use the prototype attributes on the Function:

 
 

  
  
Function.prototype.a = 10; console.log(String.a);  // 10 
 
 

Finally, let's talk about the first two questions.

 
 

  
  
// For easy expression, first distinguish between the expression on the left and the expression on the right
  
  
FunctionL = Function, FunctionR = Function; // the following code is used for deduction.
  
  
O = FunctionR. prototype = Function. prototype L = FunctionL. _ proto _ = Function. prototype // first judgment
  
  
O = L // return true
 
 

 
 

  
  
// For easy expression, first distinguish between the expression on the left and the expression on the right
  
  
StringL = String, StringR = String; // The following rule is used for deduction.
  
  
O = StringR. prototype = String. prototype L = StringL. _ proto _ = Function. prototype // first judgment
  
  
O! = L // search for whether L has _ proto _ again in a loop __
  
  
L = String. prototype. _ proto _ = Object. prototype // second Judgment
  
  
O! = L // search for whether L has _ proto _ again __
  
  
L = String. prototype. _ proto _ = null
  
  
// The third judgment
  
  
L = null
  
  
// Return false