js判断数据类型的几种方法的总结

一.js数据类型及其判断
1.typeof 数组和null，date属于object类型

console.info(typeof 5)  //number
console.info(typeof 'a')//string
console.info(typeof true)//boolean
console.info(typeof undefined)//undefined
console.info(typeof null)//object
function fn(){
	
}
console.info(typeof fn)  //function
console.info(typeof [1,2,3,4]) //object
let now=new Date()
console.info(typeof now)  //object

2.instanceof a instance B 即a的原型链上是否存在B的构造函数

function Person(name){
	this.name=name
}
const p=new Person('lucas')
console.info(p instanceof Person)  //true

console.info(5 instanceof Number) //false
console.info(new Number(5) instanceof Number) //true

3.instanceof原理 用于判断对象类型
//L表示左表达式 R表示右表达式

const instanceofMock=(L,R)=>{
	if(typeof L!='object'){
		return false
	}
	while(true){
		if(L===null){  //L已经遍历到达顶端
			return false
		}
		if(R.prototype===L.__proto__){ //L原型链上是否存在R的构造函数
			return true
		}
		L=L.__proto__
	}
}
function Student(name){
	this.name=name
}
let s=new Student()
console.info(instanceofMock(s,Student))

4.使用Object.prototype.toString()判断数据类型

console.info(Object.prototype.toString.call(1))  //[object Number]
console.info(Object.prototype.toString.call('lucas')) // [object String]
console.info(Object.prototype.toString.call(undefined))// [object Undefined]
console.info(Object.prototype.toString.call(true)) //[object Boolean]
console.info(Object.prototype.toString.call({}))  //[object Object]
console.info(Object.prototype.toString.call([]))  //[object Array]
console.info(Object.prototype.toString.call(function(){})) //[object Function]
console.info(Object.prototype.toString.call(null))  //[object Null]
console.info(Object.prototype.toString.call(Symbol('lucas')))//[object Symbol]

5.使用constructor查看目标的构造函数

var foo=5
console.info(foo.constructor)   //ƒ Number() { [native code] }
var str="lucas"
console.info(str.constructor)  //ƒ String() { [native code] }
var flag=true
console.info(flag.constructor)  //ƒ Boolean() { [native code] }
var arr=[]
console.info(arr.constructor)   //ƒ Array() { [native code] }
var obj={}
console.info(obj.constructor)   //ƒ Object() { [native code] }
var fn=function(){}
console.info(fn.constructor)    //ƒ Function() { [native code] }
var now=new Date()
console.info(now.constructor)  //ƒ Date() { [native code] }
var sy=Symbol('lucas')
console.info(sy.constructor)  //ƒ Symbol() { [native code] }
console.info(null.constructor)  //Cannot read properties of null (reading 'constructor')
console.info(undefined.constructor)  //Cannot read properties of undefined (reading 'constructor')

6.颜海镜判断数据类型的方法库

const toString=Object.prototype.toString
function type(x,strict=false){
	strict=!!strict
	if(x===null){
		return 'null'
	}
	const t=typeof x
	//number,string,boolean,undefined,symbol
	if(t!=='object'){
		return t
	}
	let cls
	let clsLow
	try{
		//slice 获取从第8个位置开始，到倒数第一个结束的值
		cls=toString.call(x).slice(8,-1)
		clsLow=cls.toLowerCase()
	}catch(e){
		//IE浏览器下的activex对象
		return 'object'
	}
	if(clsLow!=='object'){
		//区分String（）和new String（）
		if(strict&&(clsLow==="number"||clsLow==="boolean"||clsLow==='string')){
			return cls
		}
		return clsLow
	}
	if(x.constructor===Object){
		return clsLow
	}
	try{
		//__proto__部分的早期Firefox浏览器
		if(Object.getPrototypeOf(x)===null||x.__proto__===null){
			return 'object'
		}
	}catch(e){
		//IE浏览器没有getPrototypeOf会报错
	}
	//function A（）{}和new A
	try{
		const cname=x.constructor.name
		if(typeof cname==='string'){
			return cname
		}
	}catch(e){
		//无constructor
	}
	return 'unknown'
}
console.info(type('5'))