手写 `instanceof`：深入理解 JavaScript 原型链与继承机制

在 JavaScript 的面向对象编程中，instanceof 是一个用于判断对象是否为某个构造函数实例的关键运算符。它不像类型检查那样关注数据的表面形式，而是深入到对象的原型链 中，验证是否存在"血缘关系"。这种机制不仅支撑了 JavaScript 的继承体系，也为大型项目中的类型判断提供了可靠依据。本文将从原型链原理出发，手写一个 instanceof 实现，并探讨其在不同继承模式下的表现。

---

原型链：JavaScript 继承的基石

JavaScript 并没有传统意义上的"类"，而是通过原型（prototype）实现对象之间的继承关系。每个对象都有一个内部属性 [[Prototype]]（可通过 __proto__ 访问），指向其构造函数的 prototype 对象。而 prototype 本身也是一个对象，它也可能拥有自己的原型，由此形成一条原型链 ，直到 null 为止。

const arr = [];
console.log(arr.__proto__ === Array.prototype); // true
console.log(arr.__proto__.__proto__ === Object.prototype); // true

这段代码展示了数组的原型链：arr → Array.prototype → Object.prototype → null。正是这条链，使得数组可以调用 push、toString 等方法。

---

instanceof 的工作原理

A instanceof B 的本质是：检查 B.prototype 是否出现在 A 的原型链上 。如果存在，则返回 true，否则 false。

基于这一逻辑，我们可以手动实现 instanceof：

function isInstanceOf(A, B) {
  let proto = A.__proto__;
  while (proto) {
    if (proto === B.prototype) return true;
    proto = proto.__proto__;
  }
  return false;
}

该函数从 A 的直接原型开始，逐级向上遍历，直到找到 B.prototype 或到达链尾。这种方式完全复现了原生 instanceof 的行为。

例如：

function Animal() {}
function Dog() {}
Dog.prototype = new Animal();

const dog = new Dog();
console.log(isInstanceOf(dog, Dog));     // true
console.log(isInstanceOf(dog, Animal));  // true

由于 dog 的原型链包含 Dog.prototype 和 Animal.prototype，因此对两者都返回 true，体现了继承的传递性。

---

构造函数绑定继承：属性的复用

早期 JavaScript 中，一种常见的继承方式是通过 call 或 apply 在子类构造函数中调用父类构造函数，从而复制实例属性：

function Animal() {
  this.species = '动物';
}
function Cat(name, color) {
  Animal.apply(this);
  this.name = name;
  this.color = color;
}
const cat = new Cat('小白', '白色');
console.log(cat.species); // "动物"

这种方式能正确继承实例属性 ，但无法继承原型上的方法 。因此，cat instanceof Animal 会返回 false，因为 cat 的原型链并未包含 Animal.prototype。

---

原型链继承：方法的共享

为了让子类也能访问父类原型上的方法，开发者通常采用"父类实例作为子类原型"的模式：

function Animal() {}
Animal.prototype.species = '动物';

function Cat(name, color) {
  this.name = name;
  this.color = color;
}
Cat.prototype = new Animal();
Cat.prototype.constructor = Cat;

const cat = new Cat('小黑', '黑色');
console.log(cat.species); // "动物"

这里，Cat.prototype 被替换为 Animal 的一个实例，因此 cat 的原型链自然包含了 Animal.prototype。此时：

console.log(cat instanceof Cat);     // true
console.log(cat instanceof Animal);  // true

同时，修复 constructor 指向确保了类型标识的准确性，避免 cat.constructor 错误地指向 Animal。

---

直接继承 prototype：简洁但有风险

另一种写法是直接让子类的 prototype 引用父类的 prototype：

Cat.prototype = Animal.prototype;
Cat.prototype.constructor = Cat;

这种方式避免了创建多余的父类实例，节省内存。但由于是引用赋值 ，修改 Cat.prototype 会直接影响 Animal.prototype，破坏封装性。例如：

Cat.prototype.purr = function() { /* ... */ };
// 此时 Animal.prototype 也拥有了 purr 方法！

因此，这种模式虽简洁，但在多人协作或复杂系统中容易引发副作用，需谨慎使用。

---

手写 instanceof 的实际价值

在大型项目中，对象来源可能多样：可能是本地创建，也可能是远程 API 返回，或是第三方库生成。此时，仅靠 typeof 或 Object.prototype.toString 难以准确判断其"身份"。而 instanceof（或其手写版本）能基于原型链提供可靠的类型验证：

if (obj instanceof User) {
  obj.login();
}

即使 User 类由不同模块定义，只要原型链一致，判断就有效。这在插件系统、组件通信、状态管理等场景中尤为重要。

此外，手写 instanceof 有助于深入理解 JavaScript 的对象模型。它揭示了"继承"并非语法糖，而是实实在在的指针链接 。每一次 instanceof 判断，都是对这条链的一次遍历。

---

结语

instanceof 虽是一个简单的运算符，却承载着 JavaScript 面向对象设计的核心思想------基于原型的动态继承。通过手写其实现，我们不仅掌握了其工作原理，也更清晰地认识到不同继承方式对原型链结构的影响。

在现代开发中，尽管 ES6 的 class 语法让继承看起来更"传统"，但其底层依然依赖原型链。理解 instanceof 的本质，就是理解 JavaScript 如何在没有类的世界里，构建出灵活而强大的对象体系。这种理解，是写出健壮、可维护代码的重要基石。