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
//....
//....
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值