Instances illustrating the use of the instanceof operator in JavaScript

  • 2021-06-28 08:46:14
  • OfStack

Introduction to instanceof Operator

In JavaScript, the typeof operator is used to determine the type of a variable. When using the typeof operator, there is a problem with storing values using the reference type, which returns "object" regardless of the type of object being referenced.ECMAScript introduced another Java operator, instanceof, to solve this problem.The instanceof operator is similar to the typeof operator in that it identifies the type of object being processed.Unlike the typeof method, the instanceof method requires the developer to explicitly confirm that the object is of a specific type.For example:

Listing 1. instanceof example


 var oStringObject = new String("hello world"); 
 console.log(oStringObject instanceof String); //  output  "true"

This code asks, "Is the variable oStringObject an instance of an String object?"oStringObject is really an instance of the String object, so the result is "true".Although not as flexible as the typeof method, the instanceof method is useful when the typeof method returns "object".

General usage of the instanceof operator:

Usually, using instanceof is to determine if an instance belongs to a certain type.For example:

Listing 2. instanceof General Usage


 //  judge  foo  Is it  Foo  Instances of classes 
 function Foo(){} 
 var foo = new Foo(); 
 console.log(foo instanceof Foo)//true

In addition, the more important point is that instanceof can be used in an inheritance relationship to determine whether an instance belongs to its parent type.For example:

Listing 3. Usage of instanceof in Inheritance Relationships


 //  judge  foo  Is it  Foo  Instances of classes  ,  And whether it is an instance of its parent type 
 function Aoo(){} 
 function Foo(){} 
 Foo.prototype = new Aoo();//JavaScript  Prototype Inheritance 
 
 var foo = new Foo(); 
 console.log(foo instanceof Foo)//true 
 console.log(foo instanceof Aoo)//true

The above code identifies the parent class in a layer of inheritance relationship, and the instanceof operator also applies in a layer of inheritance relationship.

Do you really know the instanceof operator?

Looking at the code examples above, do you think the instanceof operator is simple? Here's a look at the complex usage.

Listing 4. instanceof complex usage


 console.log(Object instanceof Object);//true 
 console.log(Function instanceof Function);//true 
 console.log(Number instanceof Number);//false 
 console.log(String instanceof String);//false 
 
 console.log(Function instanceof Object);//true 
 
 console.log(Foo instanceof Function);//true 
 console.log(Foo instanceof Foo);//false

Have you looked at the code above and been dizzy again?Why are Object and Function instanceof themselves equal to true, while other types of instanceof themselves are not equal to true?How to explain?To understand the mystery of instanceof fundamentally, two things are needed: 1. How this operator is defined in the language specification.2, JavaScript prototype inheritance mechanism.

Listing 5. JavaScript instanceof operator code


 function instance_of(L, R) {//L  Represents a left expression, R  Represents a right expression 
 var O = R.prototype;//  take  R  Display Prototype 
 L = L.__proto__;//  take  L  Implicit prototype of 
 while (true) { 
 if (L === null) 
 return false; 
 if (O === L)//  Here's the main point: when  O  Strictly Equal  L  When, return  true 
 return true; 
 L = L.__proto__; 
 } 
 }

Listing 6. Object instanceof Object


 //  For ease of expression, first distinguish the left expression from the right expression 
 ObjectL = Object, ObjectR = Object; 
 //  Following is a step-by-step specification 
 O = ObjectR.prototype = Object.prototype 
 L = ObjectL.__proto__ = Function.prototype 
 //  No. 1 Secondary Judgment 
 O != L 
 //  Loop Find  L  Are there any more  __proto__ 
 L = Function.prototype.__proto__ = Object.prototype 
 //  No. 2 Secondary Judgment 
 O == L 
 //  Return  true

Listing 7. Function instanceof Function


 //  For ease of expression, first distinguish the left expression from the right expression 
 FunctionL = Function, FunctionR = Function; 
 //  Following is a step-by-step specification 
 O = FunctionR.prototype = Function.prototype 
 L = FunctionL.__proto__ = Function.prototype 
 //  No. 1 Secondary Judgment 
 O == L 
 //  Return  true

Listing 8. Foo instanceof Foo


//  For ease of expression, first distinguish the left expression from the right expression 
 FooL = Foo, FooR = Foo; 
 //  Following is a step-by-step specification 
 O = FooR.prototype = Foo.prototype 
 L = FooL.__proto__ = Function.prototype 
 //  No. 1 Secondary Judgment 
 O != L 
 //  Loop Find Again  L  Are there any more  __proto__ 
 L = Function.prototype.__proto__ = Object.prototype 
 //  No. 2 Secondary Judgment 
 O != L 
 //  Recycle Find  L  Are there any more  __proto__ 
 L = Object.prototype.__proto__ = null 
 //  No. 3 Secondary Judgment 
 L == null 
 //  Return  false

A Brief Analysis of instanceof's Application in Dojo Inheritance Mechanism

There is no multiple inheritance of this concept in JavaScript, just like Java 1.However, when declare is used in Dojo to declare classes, inheritance from multiple classes is allowed.The following is an example of Dojo 1.6.1.

Listing 9. Multiple Inheritance in Dojo


 dojo.declare("Aoo",null,{}); 
 dojo.declare("Boo",null,{}); 
 dojo.declare("Foo",[Aoo,Boo],{}); 
 
 var foo = new Foo(); 
 console.log(foo instanceof Aoo);//true 
 console.log(foo instanceof Boo);//false 
 
 console.log(foo.isInstanceOf(Aoo));//true 
 console.log(foo.isInstanceOf(Boo));//true

In the example above, Foo inherits from both Aoo and Boo, but when the instanceof operator is used to check whether foo is an instance of Boo, it returns false.In fact, inside Dojo, Foo still inherits only from Aoo, and the methods and properties in the Boo class are copied to Foo through the mixin mechanism, so when the instanceof operator is used to check whether it is an instance of Boo, false is returned.So Dojo added a new method called isInstanceOf to each class instance to check for multiple inheritance.


Related articles: