面试常考点：手写实现一个instanceof

原创已于 2022-02-08 16:20:31 修改 · 624 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#面试 #typescript #职场和发展

于 2022-02-08 15:58:13 首次发布

面试专栏收录该内容

12 篇文章

订阅专栏

本文详细解析了JavaScript中instanceof操作符的工作原理，通过实例展示了如何利用原型链实现自定义instanceOf函数，并测试了不同对象类型之间的匹配。

首先来看几个例子

console.log("111" instanceof Object); //false
console.log({} instanceof Object); //true
console.log([] instanceof Array); //true
console.log(String instanceof String); //false

instanceof 的原理：其实就是判断左边的对象是否在右边对象的原型链上也就是说:left.__proto__ === right.prototype，但是了解过原型链的朋友都知道，原型链的查找是会一层一层去找的，也就是说left.__proto__找不到的话就会去找 left.__proto__.__proto__，直到找到顶层是 null 为止。

function instanceOf(child, parent) {
  let left = child;
  let right = parent.prototype;
  while (true) {
    if (left === null) {//说明已经到原型链顶部了
      return false;
    }
    if (left === right) {
      return true;
    }
    left = left.__proto__;//找不到往上一层找
  }
}

ok，测试一下

console.log(instanceOf({}, Object)); //true
console.log(instanceOf({}, String)); //false
console.log(instanceOf(null, Object)); //false
console.log(instanceOf([], Array)); //true
console.log(instanceOf(String, String)); //false