详解JavaScript类型判断的四种方法
JavaScript有八种内置类型，除对象外，其他统称为“基本类型”。
- 空值（null)
- 未定义(undefined)
- 布尔值（boolean)
- 数字（number)
- 字符串（string)
- 对象(object)
- 符号（symbol,ES6中新增)
- 大整数（BigInt,ES2020引入）
Symbol：是ES6中引入的一种原始数据类型，表示独一无二的值。
BigInt：是ES2020引入的一种新的数据类型，用来解决JavaScript中数字只能到53个二进制位（JavaScript所有数字都保存成64位浮点数，大于这个范围的整数，无法精确表示的问题。具体可查看：新数据类型—BigInt
一、typeof
typeof是一个操作符而不是函数，其右侧跟一个一元表达式，并返回这个表达式的数据类型。返回的结果用该类型的字符串(全小写字母)形式表示，包括以下8种：number、boolean、symbol、string、object、undefined、function、bigInt等。
typeof原理是不同的对象在底层都表示为二进制，在Javascript中二进制前（低）三位存储其类型信息。
- 000:对象
- 010:浮点数
- 100：字符串
- 110：布尔
- 1：整数
console.log(typeofundefined)//undefind
console.log(typeofnull)//object
console.log(typeoftrue)//boolean
console.log(typeof43)//number
console.log(typeof'21')//string
console.log(typeof{a:1})//object
console.log(typeofSymbol())//symbol
console.log(typeof123n)//bigint
functiona(){}
console.log(typeofa)//function
vardate=newDate()
varerror=newError()
console.log(typeofdate)//object
console.log(typeoferror)//object
二、instanceof
instanceof是用来判断A是否为B的实例，表达式为：AinstanceofB，如果A是B的实例，则返回true,否则返回false。在这里需要特别注意的是：instanceof检测的是原型
通俗一些讲，instanceof用来比较一个对象是否为某一个构造函数的实例。注意，instanceof可以准确的判断复杂数据类型，但是不能正确判断基本数据类型
console.log(12instanceofNumber)//false
console.log('22'instanceofString)//false
console.log(trueinstanceofBoolean)//false
console.log(nullinstanceofObject)//false
console.log(undefinedinstanceofObject)//false
console.log([]instanceofArray)//true
console.log({a:1}instanceofObject)//true
console.log(jsoninstanceofObject)//true
functiona(){}
console.log(ainstanceofFunction)//true
console.log(newDate()instanceofDate)//true
console.log(reginstanceofRegExp)//true
console.log(errorinstanceofError)//true
三、Object.prototype.toString.call()
toString()是Object的原型方法，调用该方法，默认返回当前对象的[[Class]]。这是一个内部属性，其格式为[objectXxx]，其中Xxx就是对象的类型。
对于Object对象，直接调用toString()就能返回[objectObject]。而对于其他对象，则需要通过call/apply来调用才能返回正确的类型信息。
console.log(Object.prototype.toString.call(1))//[objectNumber]
console.log(Object.prototype.toString.call(1n))//[objectBigInt]
console.log(Object.prototype.toString.call('123'))//[objectString]
console.log(Object.prototype.toString.call(true))//[objectBoolean]
console.log(Object.prototype.toString.call(undefined))//[objectUndefined]
console.log(Object.prototype.toString.call(null))//[objectNull]
console.log(Object.prototype.toString.call({}))//[objectObject]
console.log(Object.prototype.toString.call([]))//[objectArray]
console.log(Object.prototype.toString.call(functiona(){}))//[objectFunction]
console.log(Object.prototype.toString.call(Symbol()))//[objectSymbol]
console.log(Object.prototype.toString.call(Math))//[objectMath]
console.log(Object.prototype.toString.call(JSON))//[objectJSON]
console.log(Object.prototype.toString.call(newDate()))//[objectDate]
console.log(Object.prototype.toString.call(newRegExp()))//[objectRegExp]
console.log(Object.prototype.toString.call(newError))//[objectError]
console.log(Object.prototype.toString.call(window)//[objectWindow]
console.log(Object.prototype.toString.call(document)//[objectHTMLDocument]
使用该方法我们可以封装一个isType方法来对类型进行判断
letisType=(type,obj)=>{
returnObject.prototype.toString.call(obj)===`[object${type}]`
}
console.log(isType('Number',12))//true
console.log(isType('Number','12'))//false
或者
lettype=function(o){
lets=Object.prototype.toString.call(o);
returns.match(/\[object(.*?)\]/)[1].toLowerCase();
};
console.log(type(12))//number
console.log(type('12'))//string
console.log(type({}))//object
console.log(type([]))//array
四、constructor
constructor属性，可以得知某个实例对象，到底是哪一个构造函数产生的。
constructor属性表示原型对象与构造函数之间的关联关系，如果修改了原型对象，一般会同时修改constructor属性，防止引用的时候出错。所以，修改原型对象时，一般要同时修改constructor属性的指向。
console.log('22'.constructor===String)//true
console.log(true.constructor===Boolean)//true
console.log([].constructor===Array)//true
console.log(document.constructor===HTMLDocument)//true
console.log(window.constructor===Window)//true
console.log(newNumber(22).constructor===Number)//true
console.log(newFunction().constructor===Function)//true
console.log((newDate()).constructor===Date)//true
console.log(newRegExp().constructor===RegExp)//true
console.log(newError().constructor===Error)//true
注意：
1、null和undefined是无效的对象，因此是不会有constructor存在的，这两种类型的数据需要通过其他方式来判断。
2、函数的constructor是不稳定的，这个主要体现在自定义对象上，当开发者重写prototype后，原有的constructor引用会丢失，constructor会默认为Object
以上就是JavaScript类型判断的四种方法的详细内容，更多关于JavaScript类型判断的资料请关注毛票票其它相关文章！