当前位置: 首页 > 科技观察

JS中必须知道的四种数据类型判断方法

时间:2023-03-13 21:07:13 科技观察

js有多种数据类型(Number(值)、String(字符串)、Boolean(布尔值)、Null、Undefined、Symbol、Object、function等),在开发过程中,难免要对数据类型进行判断。本文总结了四种判断方法:typeoftypeof是一个运算符,它有两种使用方式:(1)typeof(表达式);(2)typeof变量名;返回值是一个字符串,用于描述变量的数据类型;因此,可以用来判断number、string、object、boolean、function、undefined、symbol这七种类型。每种情况下返回的内容如下表所示:可以看到前端百题[001])小测//stringconsole.log(typeof('lili'));//string//digitalconsole.log(typeof(1));//number///booleanconsole.log(typeof(true));//boolean//undefinedconsole.log(typeof(undefined));//undefined//对象控制台。log(typeof({}));//object//数组console.log(typeof([]));//object//nullconsole.log(typeof(null));//object//functionconsole.log(typeof(()=>{}));//function//Symbolvalueconsole.log(typeof(Symbol()));//symbolinstanceofinstanceof操作符用于检测构造函数的原型属性是否出现在原型上一个实例对象的链,返回值是一个布尔值,用于表示一个变量是否属于一个对象的实例。其语法如下:(详见前端百问[001])objectinstanceofconstructorsmalltestconstarr=[1,2];//判断Object的原型是否在对象的原型链上arrayconsole.log(arrinstanceofObject);//true//数组的原型arrconstproto1=Object.getPrototypeOf(arr);console.log(proto1);//[]//数组的原型arrconstproto2=Object.getPrototypeOf(proto1);console.log(proto2);//[]//Object的原型console.log(Object.prototype);//判断arr的原型是否等于Object的原型console.log(proto1===Object.prototype);//false//判断arr的prototype是否等于Object的prototypeconsole.log(proto2===Object.prototype);//trueconstructor这种判断方式其实涉及到了它们之间的关系prototype、constructor和instance,更深层次的解释会放在后面的内容中,下面只需要简单了解一下以及三者之间的关系。在定义一个函数(构造函数)时,JS引擎会为其添加一个原型,原型上对应的constructor属性指向构造函数,这样原型和构造函数就可以互相认识了。当构造函数被实例化时,会生成一个对应的实例,它的实例可以访问对应原型上的constructor属性,这样实例就可以知道自己是谁创建的,从而在新对象生成后可以了解它的数据类型.小测试constval1=1;console.log(val1.constructor);//[Function:Number]constval2='abc';console.log(val2.constructor);//[Function:String]constval3=true;console.log(val3.constructor);//[Function:Boolean]这个方法虽然可以判断它的数据类型,但是有两个缺点:null和undefined是无效对象,所以不会有构造函数。数据类型需要通过其他方式判断。函数的构造函数不稳定,主要体现在自定义对象上。当开发者重写原型时,原来的构造函数引用会丢失,构造函数会默认为ObjecttoString()toString()是Object的原型方法。Call该方法默认返回当前对象的[[Class]]。这是格式为[objectXxx]的内部属性,其中Xxx是对象的类型。因此,通过Object.prototype.toString()方法可以更准确的判断变量的类型。该类型针对不同变量类型返回的结果如下:使用该方法,很容易构建类型识别函数,代码如下:functiontype(target){constret=typeof(target);consttemplate={“[objectArray]”:“array”,[objectObject]“:”object”,[objectNumber]”:“number-object”,[objectBoolean]”:“boolean-object”,[objectString]”:'字符串对象'}if(target===null){return'null';}elseif(ret==“object”){conststr=Object.prototype.toString.call(target);returntemplate[str];}否则{returnret;}}小测试console.log(type({}));//objectconsole.log(type(123));//numberconsole.log(type('123'));//string