Suggest an edit

Improve this article

Refine the answer for “Why instanceof operator is needed in JavaScript”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

**`instanceof`** checks if an object's prototype chain contains a specific constructor's prototype.

## Theory

### TL;DR

- Like tracing a family tree: not just the immediate parent, but all ancestors up to `Object`
- `typeof` gives a category ("object", "function"); `instanceof` identifies the actual class in the hierarchy
- Use for class membership checks in inheritance chains; skip for primitives and cross-frame objects
- `arr instanceof Array` fails with iframes; `Array.isArray()` handles that correctly

### Quick example

```javascript
class Animal {}
class Dog extends Animal {}

const rex = new Dog();

console.log(rex instanceof Dog);    // true - Dog.prototype in chain
console.log(rex instanceof Animal); // true - walks up, finds Animal.prototype
console.log(rex instanceof Object); // true - reaches the root
console.log(typeof rex);            // "object" - no hierarchy info
```

`typeof` returns `"object"` for arrays, dates, and custom class instances alike. `instanceof` walks the prototype chain and shows exactly where an object fits in the class hierarchy.

### What typeof cannot detect

JavaScript's `typeof` covers 7 primitive categories plus `"object"` and `"function"` for everything else. Arrays, dates, and instances of custom classes all return `"object"`. No way to distinguish them.

`instanceof` exists because JS uses prototype-based inheritance at runtime, with no static type system. Checking "is-a" relationships requires walking the chain while the program runs.

### How the chain walk works

When you write `rex instanceof Animal`, the engine takes `rex.__proto__` and compares it to `Animal.prototype`. No match? It moves to `rex.__proto__.__proto__`. Keeps going until a match or `null`.

V8 (Chrome, Node.js) caches prototype lookups using hidden classes, so repeated checks on the same object shape are fast. Firefox follows the ECMAScript spec directly: if `Constructor.prototype` is not an object, it returns `false` immediately.

### When to use

- DOM events: `event instanceof MouseEvent` in handlers
- Error branching: `err instanceof TypeError` before different recovery paths
- Polymorphic dispatch: guard clauses when a method expects a specific subclass
- Not for primitives: `'hello' instanceof String` returns `false`
- Not for cross-frame arrays: use `Array.isArray()` instead

### Common mistakes

**Checking string primitives**

```javascript
console.log('hello' instanceof String); // false
```

String literals are primitives, not `String` objects. `instanceof` skips auto-boxing entirely. Use `typeof str === 'string'`.

**Cross-frame arrays**

```javascript
const iframe = document.createElement('iframe');
document.body.appendChild(iframe);
const arr = new iframe.contentWindow.Array();
console.log(arr instanceof Array); // false - different global Array
```

Each iframe has its own copy of built-in constructors. In production, this comes up whenever you pass data between an iframe and the parent page. Fix: `Array.isArray(arr)`.

**Mutating the constructor property**

```javascript
const proto = {};
const obj = Object.create(proto);
obj.constructor = Dog; // does nothing for instanceof
console.log(obj instanceof Dog); // false - chain is what matters
```

`instanceof` reads the prototype chain, not the `constructor` property. The property is writable but `instanceof` ignores it.

**Symbol.hasInstance override**

```javascript
class FakeDog {
  static [Symbol.hasInstance]() { return true; }
}
console.log({} instanceof FakeDog); // true - custom logic, not chain walk
```

Some libraries override this. If you need a reliable chain check, use `Object.getPrototypeOf(obj)` directly.

### Real-world usage

- Express checks `req instanceof http.IncomingMessage` in core middleware
- Error handling in Node.js: `if (err instanceof SyntaxError)` before response branching
- React avoids `instanceof` for element checks and uses duck-typing instead, precisely because of the cross-realm problem
- Mocha verifies that assertion objects are proper function instances

### Follow-up questions

**Q:** How does `instanceof` differ from checking `obj.constructor === Constructor`?
**A:** The `constructor` property is mutable and can be reassigned. `instanceof` reads the actual prototype chain and is not affected by that reassignment.

**Q:** What happens with objects from different iframes?
**A:** The check returns `false`. Each browsing context has its own built-in constructors. An array created in an iframe is not an instance of the parent frame's `Array`. Use `Array.isArray()` for arrays.

**Q:** What is `Symbol.hasInstance`?
**A:** A static method that customizes `instanceof` behavior for a class. Example: `class Iterable { static [Symbol.hasInstance](obj) { return Symbol.iterator in obj; } }`. Any object with an iterator would pass `instanceof Iterable`. Some libraries use this to intercept checks.

**Q:** How do you implement `instanceof` manually without using it?
**A:** Walk the prototype chain: `function myInstanceOf(obj, Cons) { let proto = Object.getPrototypeOf(obj); while (proto) { if (proto === Cons.prototype) return true; proto = Object.getPrototypeOf(proto); } return false; }`. This is a common question at senior-level interviews.

## Examples

### Class hierarchy guard

```javascript
class Shape {}
class Circle extends Shape {
  constructor(radius) {
    super();
    this.radius = radius;
  }
}

console.log(getArea(new Circle(5))); // 78.54
console.log(getArea({}));            // throws TypeError
```

`instanceof` guards the function entry point, then branches based on subclass. Both checks walk the same chain, just stop at different points.

### Error type dispatching

```javascript
async function fetchData(url) {
  try {
    const res = await fetch(url);
    return await res.json();
  } catch (err) {
    if (err instanceof TypeError) {
      console.error('Network failure or invalid URL');
    } else if (err instanceof SyntaxError) {
      console.error('Response body is not valid JSON');
    } else {
      throw err;
    }
  }
}
```

This pattern shows up constantly in API layers. `instanceof` lets you branch on error type cleanly without parsing `.message` strings.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts877 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.