JavaScript中的intanceof如何实现
发布网友
发布时间：2024-10-21 09:17
共1个回答
热心网友
时间：2024-12-02 20:03
在前端开发的学习中，prototype，是我们一直要去攻克的难题。
前端所有的对象构造，伪class，new都是通过prototype进行操作实现的。
平时我们项目开发中，对于prototype其实应用并不多，因为我们大部分都是用到util包来处理的。
特别是intanceof可以用来比较复杂数据类型。
举例说明下：
我们来举例说明说明下intanceof?
/aa/g?instanceof?Object???true/aa/g?instanceof?RegExp??true一切对象的baseObject为Object，看似比较拗口，也就是RegExp的prototype指向的就是Object。
let?a1?=?Object.getPrototypeOf(/aa/g)getProtypeOf是Object对象自带的API，能够拿到参数的原型对象
let?a1?=?Object.getPrototypeOf(/aa/g)??a1?===?RegExp.prototype这里的a1就是指向复杂对象RegExp的原型，也就是就是instance比较为true
但是
a1?===?Object.prototype???还是false这个时候我们还需要沿着链继续往上寻找
代码为
let?a2?=?Object.getPrototypeOf(a1)??a2?===?Object.prototype?这个时候就为true但是如何写一个比较通过的数数据比较呢？?
function?myInstanceof(left,?right)?{??//?这里先用typeof来判断基础数据类型，如果是，直接返回false??if(typeof?left?!==?'object'?||?left?===?null)?return?false;??let?proto?=?Object.getPrototypeOf(left);??while(true)?{?//循环往下寻找，直到找到相同的原型对象????if(proto?===?null)?return?false;????if(proto?===?right.prototype)?return?true;//找到相同原型对象，返回true????proto?=?Object.getPrototypeof(proto);??}}//?验证一下自己实现的myInstanceof是否OKconsole.log(myInstanceof(new?Number(123),?Number));//?true这里面有几个知识点，其实主要就是要了解原型的查找，以及如何获取原型。
接下来我们说下prototype在链上的对应关系。prototype、getPrototypeOf和__proto__直接的对应关系。
例如我们大致举例说明下
function?fnA?(a,b){this.dang?=?a;this.xia?=?b}let?a?=?new?fnA('wan'?,?'ali')fnA.prototype.toString?=?function()?{??return?'[aaaa?'?+?this.dang?+?']';}console.log(Object.getPrototypeOf(a));?//?fnA?{toString:??,?constructor:??}console.log(a.__proto__);?//?fnA??{toString:??,?constructor:??}console.log(fnA.prototype);?//?fnA?{toString:??,?constructor:??}这几个是获取方式，他们之间又是如何关联的呢？?
有时间我好好再来说道一番。
PS：学习前端一定要一步步的来，要有锲而不舍的精神，把所有的东西一步步学扎实。基础知识枯燥乏味，但是对于你对前端的深刻理解有着非常的重要。
