instanceof 原理和简单实现

1. 是什么

在 MDN 上是这样描述 instanceof 的:

The instanceof operator tests whether the prototype property of a constructor appears anywhere in the prototype chain of an object.

instanceof 运算符用于测试构造函数的 prototype 属性是否出现在对象原型链中的任何位置

2. 实现

这里已经描述的很清楚了, 怎么实现呢
思路:

  • 首先 instanceof 左侧必须是对象, 才能找到它的原型链
  • instanceof 右侧必须是函数, 函数才会prototype属性
  • 迭代 , 左侧对象的原型不等于右侧的 prototype时, 沿着原型链重新赋值左侧

代码:

const instance_of = (left, right) => {
	// 基本的数据类型为false
	const baseType = ['number', 'string', 'boolean', 'undefined', 'symbol']
	if(baseType.includes(typeof left)) return false
	// 右侧函数的原型
	const RP = right.prototype
	while(true) {
		// 出口, left.__proto__.__proto__....的尽头是null, 
		// 并且 null instanceof 任何类型 都不成立, 即使是Object, 下面会说到
		if(left === null) {
			return false
		} else if(left === RP) {
			return true
		}
		// 找不到 ? 把left的值改为它的原型
		left = left.__proto__
	}
}
3. 需要注意的一些情况

以下状况均为 false

/** 
* 因为 'abc' 是字符串, 是基本数据类型 
* 有人说 'abc'.__proto__ === String.prototype 明明是成立的呀
* 这是因为, 当一个字符串调用方法或者属性的时候( 如'abc'.__proto__ ),会发生一个装箱操作,转换为包装类型
* 隐式转换为 new String('abc')
* 但是 'abc' instanceof String 并不存在装箱操作
*/
'abc' instanceof String  // false

// null不具有任何对象的特性, null也没有__proto__属性
null instanceof Object  // false

// String.__proto__.constructor.name === 'Function'
String instanceof String // false
Number instanceof Number  // false
//....
//....

你可能感兴趣的:(整理)