原型查找是如何在继承的类上在isPrototypeOf中工作的？

Question

以下列代码为起点：

​

class SuperKlass {};
class SubKlass extends SuperKlass {};

const superKlass = new SuperKlass();
const subKlass = new SubKlass();

console.log(SuperKlass.isPrototypeOf(SubKlass));
console.log(SuperKlass.prototype.isPrototypeOf(subKlass));
console.log(SuperKlass.prototype.isPrototypeOf(SubKlass.prototype));
// true true true

​

这些查找是如何工作的？例如，方法的定义声明：

isPrototypeOf()方法检查一个对象是否存在于另一个对象的原型链中。

因此，对于第一个对象，SuperKlass.isPrototypeOf(SubKlass)，SubKlass是我们正在检查的原型链的对象，以确定它是否存在于SuperKlass中。那么这到底是怎么回事呢？我试着在Chrome工具中调试它，并在第一个工具的试错中找到了答案：

​

​

当查找原型链时，它是使用__proto__还是.prototype？对另外两个人又有什么用？

Answer 1

这里有两个重要的概念来理解

1. 原型链是通过.__proto__而不是通过.prototype遍历的。
2. 如果方法调用具有：Parent.isPrototypeOf(item)形式，那么我们首先检查是否为item.__proto__ === Parent，如果不是，则检查是否为item.__proto__.__proto__ === Parent，.一直到原型链结束(<...>.__proto__ === null)。

有了这个功能，我们就可以构建一个基本的函数来模拟这个方法，并添加一些调试助手来查看它是如何工作的：

​

function isPrototypeOf(obj, parent) {
    // a function to search the prototype chain of object to see if it's found in parent
    let isFound = false;
    let proto = obj.__proto__;
    while (proto) {
        console.log('Proto: ', proto);
        if (proto === parent) {
            console.log('Found!');
            isFound = true;
            break;
        }
        proto = proto.__proto__;
    }
    return isFound;
}


class SuperKlass {};
class SubKlass extends SuperKlass {};
const superKlass = new SuperKlass();
const subKlass = new SubKlass();
console.log(isPrototypeOf(SubKlass, SuperKlass));
console.log(isPrototypeOf(subKlass, SuperKlass.prototype));
console.log(isPrototypeOf(SubKlass.prototype, SuperKlass.prototype));
console.log(isPrototypeOf(SubKlass.prototype, SuperKlass.prototype.prototype)); // this shouldn't be found and will traverse until null

​