我们分别在《JavaScript是由什么组成的》和《JavaScript中的秦始皇》两篇文章中谈到了instanceof。本篇我们来聊聊instanceof,什么是instanceof?MAN的解释是:instanceof操作符用于检测构造函数的prototype属性是否出现在实例对象的原型链上。可以看出,instanceof的左边必须是一个对象才能找到它的原型链,而instanceof的右边必须是一个函数,函数会有一个原型属性简单的例子:functionResume(name,年龄,爱好){this.name=name;这个。年龄=年龄;this.hobby=hobby;}constjohan=newResume('johan','18','swim');console.log(johaninstanceofResume);//trueconsole.log(johaninstanceofObject);//true在JavaScript中有一个例子:ObjectinstanceofObjectFunctioninstanceofFunction可以理解为Object的原型链上的一个值等于Object.prototype;Function原型链上的值也与Function.prototye一致;ObjectinstanceofObject可以理解为:Object.__proto__===Function。prototypeFunction.prototype.__proto__===Object.prototypeObject.__proto__.__proto__===Object.prototypeFunctioninstanceofFunction可以理解为:Function.__proto__===Function.prototype的本质是因为创建了内置函数由Function构造函数,包括它自己的手写instanceof根据上面的描述,也就是左边的__proto__===右边的.prototype第一版//第一版functionmyInstanceof(left,right){if(left.__proto__===right.原型){返回真;}else{返回错误;}}console.log(myInstanceof(johan,Resume));//trueconsole.log(myInstanceof(johan,Object));//false在第一个版本中,我们在左边实现了__proto__===在右边。prototype但这还不够,myInstanceof还需要检查left是否在right的原型链上。所以我们递归left.__proto__。直到原型链的最深层nullsecondversion//secondversionfunctionmyInstanceof(left,right){if(left.__proto__===right.prototype){returntrue;}else{if(left===null){returnfalse;}返回myInstanceof(left.__proto__,right);}}第三版:把它当成基本类型正如我一开始所说的,instanceof的左边必须是一个对象,这样才能找到它的原型链但是别忘了,除了null和undefined之外的基本类型都是“受保护的”"通过基本封装类型varnum=1;console.log(myInstanceof(num,Number));//trueconsole.log(numinstanceofNumber);//false所以需要增加基本类型函数的判断myInstanceof(left,right){if(typeofleft!=='object'||left===null)returnfalse;如果(left.__proto__===right.prototype){返回true;}else{if(left===null||left.__proto__===null){returnfalse;}返回myInstanceof(left.__proto__,right);}}看看别人的instanceof实现函数myInstanceof(left,right){//基本数据类型直接返回falseif(typeofleft!=='object'||left===null)returnfalse;//getPrototype是对象ct对象自带的方法,相当于__proto__letproto=Object.getPrototypeOf(left);while(true){//向下循环寻找同一个对象if(proto==null)returnfalse;//查找相同的原型对象if(proto==right.prototype)returntrue;proto=Object.getPrototypeOf(proto);}}虽然用法比我的高级得多。——什么是JavaScript深入理解JavaScript——JavaScript是由什么组成的?——复制的秘密深入理解JavaScript——Prototype深入理解JavaScript——Inheritance深入理解JavaScript——JavaScript中的第一位皇帝深入理解JavaScript——Instanceof——寻找祖先深入理解JavaScript——Function深入理解JavaScript——Scope深入理解JavaScript——this关键字深入理解JavaScript——call,apply,bind会深入理解JavaScript——马上executedfunction(IIFE)深入理解JavaScript——词法环境深入理解JavaScript——执行上下文和调用栈深入理解JavaScript—ScopeVSExecutionContext深入理解JavaScript—Closure深入理解JavaScript—防抖与节流深入理解JavaScript—函数式编程深入理解JavaScript—垃圾回收机制深入理解JavaScript-数组深入理解JavaScript——Cycles来这里深入理解JavaScript——String
