理解 JavaScript 的 `instanceof` 运算符

在 JavaScript 中，instanceof 运算符用于检查一个对象是否是另一个构造函数的实例。instanceof 的工作原理是沿着对象的原型链进行检查，以确定构造函数的 prototype 属性是否出现在对象的原型链中。为了更好地理解 instanceof 的工作机制，我们可以自己实现一个类似功能的函数。在本文中，我们将逐步讲解如何实现一个自定义的 myInstanceOf 函数，并探讨其背后的工作原理。

什么是 instanceof 运算符？

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。其基本语法如下：

object instanceof constructor

如果 object 是 constructor 的实例，则返回 true；否则，返回 false。

实现自定义的 myInstanceOf 函数

我们将按照 instanceof 运算符的工作原理来实现我们的 myInstanceOf 函数。下面是完整的实现代码：

function myInstanceOf(obj, constructor) {
    // 获取目标构造函数的原型
    let targetPrototype = constructor.prototype;

    // 获取对象的原型
    let objPrototype = Object.getPrototypeOf(obj);

    // 检查原型链上是否存在目标构造函数的prototype
    while (objPrototype !== null) {
        if (objPrototype === targetPrototype) {
            return true;
        }
        objPrototype = Object.getPrototypeOf(objPrototype);
    }

    return false;
}

// 示例
function Example() {}
let obj = new Example();

console.log(myInstanceOf(obj, Example)); // 输出 true

代码详解

1. 获取目标构造函数的原型

首先，我们需要获取目标构造函数的 prototype 属性。

let targetPrototype = constructor.prototype;

2. 获取对象的原型

接下来，我们需要获取对象的原型。可以使用 Object.getPrototypeOf 方法来获取对象的原型。

let objPrototype = Object.getPrototypeOf(obj);

3. 检查原型链

我们通过一个 while 循环遍历对象的原型链，检查目标构造函数的 prototype 属性是否出现在对象的原型链上。

while (objPrototype !== null) {
    if (objPrototype === targetPrototype) {
        return true;
    }
    objPrototype = Object.getPrototypeOf(objPrototype);
}

如果在原型链上找到了目标构造函数的 prototype 属性，则返回 true；否则，继续沿着原型链向上查找。

4. 返回结果

如果遍历完原型链仍未找到目标构造函数的 prototype 属性，则返回 false。

return false;

示例使用

为了验证我们的 myInstanceOf 函数，我们定义一个示例构造函数 Example，并使用 myInstanceOf 检查其实例。

function Example() {}
let obj = new Example();

console.log(myInstanceOf(obj, Example)); // 输出 true

可以看到，myInstanceOf 函数成功检测到 obj 是 Example 的实例，并正确返回了 true。