03 instanceof关键字

JavaScript 实现 instanceof 关键字

instanceof 关键字的用法

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

// 定义构造函数
function C(){}
function D(){}

var o = new C();

o instanceof C; // true，因为 Object.getPrototypeOf(o) === C.prototype
o instanceof D; // false，因为 D.prototype 不在 o 的原型链上

获取原型的方法

1. 构造函数.prototype

   Person.prototype  // {constructor: ƒ}  得到一个对象，就是原型兑现，里面有一个构造函数
   

2. 实例对象.__proto__

   person1.__proto__ //  {constructor: ƒ}
   

3. object.getPrototypeOf(实例对象)

   Object.getPrototypeOf(person1)	// {constructor: ƒ}
   

实现myInstanceof

经过上面的步骤我们可以知道 Person.prototype === person1.__proto__ // true而所有的对象的原型链定都是Object,Object.__proto__是null,所有我们可以实现简单的Instanceof

利用wile 循环实现

function instanceOf(father, child) {
    const fp = father.prototype
    var cp = child.__proto__
	
    // 如果不等null,继续循环
    while (cp) {
        if (cp === fp) {
            return true
        }
        cp = cp.__proto__
    }
    return false
}

利用递归实现

const myInstanceof = (obj, Fn) => {
  if (typeof obj !== 'object') return false
  const structure = obj.__proto__
  if (structure === null) return false
  if (structure !== Fn.prototype) {
    return myInstanceof(structure, Fn)
  } else {
    return true
  }
}

instanceof 的注意事项

1. 因为可以改变原型与实例的原型链，导致不能确保每次的结果都是一样的

2. 基本类型没有构造函数，所以 instanceof Object 都是falses

参考链接：

https://juejin.cn/post/7023906112843808804

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/instanceof

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf