The instanceof operator tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. The return value is a boolean value.
Syntax of using instanceof is as follows
object instanceof constructor
Where object is an object (or an expression that evaluates to an object). constructor is anything that constructs an object. It could be a class or a constructor function.
There are several ways in which we can create an object in JavaScript.
For Example, the following function creates an object person using the constructor function Person.
function Person(Name) {
this.Name = Name;
}
let person = new Person("aida bugg");
We want to know whether the Person constructor function created the instance person. This is where we use the instanceof operator. The following code checks if person is created from the Person constructor function.
console.log(person instanceof Person); // true
person Instanceof Object also returns true, this is because the instanceof operator searches the prototype chain of the person object.
console.log(person instanceof Object); // true
The Instanceof operator compares the prototype of the object with the Prototype Property of the constructor. If they are the same then it returns true. If not it continues to check its prototype chain of the object.
When we run the code person instanceof Person the instanceof operator compares its prototype with the Prototype property of the constructor function. Since they are equal it returns true.
console.log(person.__proto__=== Person.prototype) //true
When we check person instanceof Object the instanceof compares the prototype property of the Object (Object.prototype) with the prototype of the person (person.__proto__) object. Since they are not equal it moves up the chain (person.__proto__.__proto__) and then compares it again with Object.prototype. Since they are equal it returns true.
console.log(person.__proto__ === Object.prototype) //false
console.log(person.__proto__.__proto__=== Object.prototype) //true
Classes are another way to create objects.
class Person {
constructor(name) {
this.name = name;
}
}
const person = new Person('Bill Gates');
console.log(person instanceof Person) //true
console.log(person instanceof Object) //true
Note that we can change the prototype of an object after it is constructed.
In the following example, we create the person object from Person function. But later we change its prototype using the Object.setPrototypeOf to Animal function.
function Person(name) {
this.name = name;
}
function Animal(name) {
this.name = name;
}
const person = new Person('Bill Gates');
console.log(person instanceof Person) //true
console.log(person instanceof Animal) //false
console.log(person instanceof Object) //true
//Change the Prototype of person to Animal;
Object.setPrototypeOf(person, Animal.prototype)
console.log(person instanceof Person) //false
console.log(person instanceof Animal) //true
console.log(person instanceof Object) //true
Primitive values are not objects and therefore do not have a Prototype Property. Hence instanceof will not work with them. You can use the Typeof operator for primitive values
let literalString = 'This is a literal string';
let stringObject = new String('String created with constructor');
literalString instanceof String; // false, string literal is not a String
stringObject instanceof String; // true
Scripts running in different windows or frames ( <iframe>) gets their own execution environments. This means that they have a different global objects, constructors, etc.
This may result in unexpected results. For instance, [] instanceof window.frames[0].Array will return false, because Array.prototype !== window.frames[0].Array.prototype & arrays inherit from the former.
let literalString = 'This is a literal string';
let stringObject = new String('String created with constructor');
literalString instanceof String; // false, string literal is not a String
stringObject instanceof String; // true
