JavaScript instanceof

Introduction to the instanceof Operator

The instanceof operator in JavaScript is a powerful tool for determining whether an object is an instance of a specific class or constructor function. It assists developers in verifying the type of an object at runtime, facilitating type checking and implementing polymorphism effectively. This operator checks the prototype chain of an object against a constructor function's prototype, offering a boolean result that indicates whether the object inherits from the prototype.

Syntax and Usage

The syntax of the instanceof operator is straightforward:

object instanceof Constructor

Where object is the object to test against the Constructor. The operator returns true if the object is an instance of the Constructor or has inherited from it; otherwise, it returns false.

Code Example: Basic Usage

Consider the following example where we define a class Vehicle and create an instance of it:

Advanced Applications

Beyond basic type checking, the instanceof operator plays a crucial role in more complex scenarios involving inheritance and polymorphism. Let's explore a scenario with inheritance:

Code Example: Inheritance

This example illustrates how instanceof confirms that myCar is not only an instance of Car but also an instance of Vehicle, showcasing the operator's ability to recognize the inheritance chain.

How instanceof Walks the Prototype Chain

instanceof does not check which constructor created the object directly. Instead, it walks up the object's prototype chain and asks: does Constructor.prototype appear anywhere in it? As soon as it finds a match, it returns true; if it reaches the end of the chain (null) without a match, it returns false.

Because of this, you can break or change an instanceof result by reassigning the prototype chain — the check is purely about chain membership, not about the constructor that ran. To understand the chain itself, see Prototypal inheritance and Class basic syntax.

Customizing instanceof with Symbol.hasInstance

You can override what obj instanceof Constructor returns by defining a static [Symbol.hasInstance] method on the constructor. When present, instanceof calls it with the left-hand operand and uses its boolean result, ignoring the prototype chain entirely.

This is useful for duck-typing — treating any object that "looks right" as a member of a type — without forcing it through the class hierarchy.

instanceof vs typeof vs constructor

These three tools answer different questions, and choosing the wrong one is a common source of bugs.

• typeof returns a string for primitive type categories. It is great for primitives but returns "object" for almost everything (arrays, null, dates, plain objects), so it cannot distinguish object kinds.
• instanceof tests prototype-chain membership and respects inheritance — but it fails across realms (see below) and does not work on primitives.
• obj.constructor points at the function that created the object, but it is just a writable property and only reflects the most specific class, not the whole chain.

The built-in constructors used above are covered in Native prototypes.

The Realm (iframe/window) Caveat

Each browsing context — every iframe or popup window — has its own set of built-in constructors and its own Array.prototype, Object.prototype, and so on. An array created in an iframe is a real array, but it does not inherit from your window's Array.prototype. As a result, arrayFromIframe instanceof Array returns false in the parent window, even though the value is genuinely an array. This is the most common reason instanceof "lies."

For values that may cross realms, prefer realm-agnostic checks like Array.isArray(value).

Reliable Type Tags with Object.prototype.toString

When you need a robust, realm-safe type check that also works on primitives, Object.prototype.toString returns an internal tag string in the form [object Type]. It cannot be fooled by reassigned prototypes the way constructor can, and it works across realms.

Use it via .call(value) so the value becomes this. A class can even control its own tag with the Symbol.toStringTag property.

Best Practices and Considerations

While the instanceof operator is invaluable, it's essential to use it judiciously:

• Prototype Chain Sensitivity: The instanceof operator relies on the prototype chain, which means changes to an object's prototype can affect the outcome of instanceof checks.
• Use in Polymorphism: It is particularly useful in scenarios where polymorphic behavior is desired, allowing for flexible code that can handle objects of different types in a unified manner.
• Cross-frame Issues: Be cautious when using instanceof with objects coming from different JavaScript contexts (e.g., iframes or different windows), as each context has its unique prototype chain.

Practical Example: Polymorphism

Here’s how you might use instanceof to implement polymorphic behavior:

Conclusion

Understanding and effectively utilizing the instanceof operator is crucial for mastering JavaScript's object-oriented programming aspects. It not only aids in type checking and ensuring the correctness of your code but also empowers you to write more flexible and maintainable code through polymorphism. By integrating the instanceof operator wisely into your development practices, you can significantly enhance the robustness and scalability of your JavaScript applications.

Practice