登录
手写 `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 如何在没有类的世界里，构建出灵活而强大的对象体系。这种理解，是写出健壮、可维护代码的重要基石。
