当前位置：首页 > news >正文

深入理解 JavaScript：手写 `instanceof` 及其背后的原型链原理

news 2026/8/19 10:33:15

在 JavaScript 的面向对象编程中，判断一个对象的“血缘关系”是开发中的常见需求。虽然我们经常使用内置的instanceof运算符，但理解其底层逻辑对于掌握 JavaScript 的原型链至关重要。

什么是`instanceof`？

instanceof是一个原型关系判断运算符。在典型的 OOP（面向对象编程）语言中，它用于判断一个实例是否属于某个类。但在 JavaScript 中，它的本质是：检查左边对象的原型链上是否存在右边构造函数的prototype属性。

例如，在以下继承关系中：

function Animal() {} function Person() {} Person.prototype = new Animal(); // 原型继承 Person.prototype.constructor = Person; const p = new Person(); console.log(p instanceof Person); // true console.log(p instanceof Animal); // true

原型链的基础知识

要实现instanceof，必须先理解两个核心概念：

__proto__：每个对象都有一个私有属性，指向它的原型对象。
prototype：每个函数都有一个原型对象，用于存储共享的属性和方法。

我们可以通过一个数组的例子来观察原型链的终点：

arr.__proto__-> 指向Array.prototype
arr.__proto__.__proto__-> 指向Object.prototype
arr.__proto__.__proto__.__proto__-> 指向null（链条结束）

手写实现`instanceof`

根据上述原理，我们可以编写一个自定义函数isInstanceOf。其核心逻辑是：利用while循环沿着__proto__不断向上查找，直到找到匹配的prototype或到达原型链顶端（null）。

代码实现

/** * 判断 right 是否出现在 left 的原型链上 * @param {Object} left - 实例对象 * @param {Function} right - 构造函数 */ function isInstanceOf(left, right) { // 获取实例的隐式原型 let proto = left.__proto__; // 遍历原型链 while (proto) { // 如果原型相等，说明匹配成功 if (proto === right.prototype) { return true; } // 否则继续向上查找 proto = proto.__proto__; } // 查找到 null 还没找到，返回 false return false; }

测试用例

function Animal() {} function Cat() {} Cat.prototype = new Animal(); function Dog() {} Dog.prototype = new Animal(); const dog = new Dog(); console.log(isInstanceOf(dog, Dog)); // true console.log(isInstanceOf(dog, Animal)); // true console.log(isInstanceOf(dog, Object)); // true console.log(isInstanceOf(dog, Cat)); // false (dog 不是猫)