js检测数据类型方法总结

上篇文章中总结了js中的数据类型，那么你知道有哪些方法可以用来检测具体的数据类型吗？如Number类型、Array类型、Object类型？

回顾一下js中数据类型分为两大类，基础类型和引用数据类型，主要有：

基本数据类型

• Number
• String
• Boolean
• Null
• Undefined
• Symbol

复杂数据类型

• Array
• Function
• Object

检测js中的数据类型常用的方法有：

1. typeof
2. instanceof
3. Object.prototype.toString

对比一下这三种方法的优缺点：

typeof方法

typeof 5 // number 有效

typeof 'dsd' // string 有效

typeof true // boolean 有效

typeof undefined // undefined 有效

typeof function(){} // function 有效

typeof null // object 无效

typeof [] // object 无效

typeof {} // object 无效

从以上例子中可以看到：

• typeof 用来检测基本数据类型，除了Null无效外，其他都能返回正确的结果；
• 但引用类型，除了function外，其他引用类型一律都返回object结果。

Note：这在需要对数据结构进行详细划分的时候就不适用，比如说你要明确区分数组和对象，然后进行处理的时候，typeof就完全达不到效果

好处：检测快捷方便

坏处：不能检测更为准确的数据类型，如Array、Object、Null

instanceof

MDN: 用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。

[] instanceof Array; // true

{} instanceof Object; // true

newDate() instanceof Date; // true

function Person(){};

newPerson() instanceof Person; // true

[] instanceof Object; // true

newDate() instanceof Object; // true

newPerson instanceof Object; // true

由上面例子可以看出：

• instanceof确实可以检测部分引用数据类型
• []是Array的实例，也是Object的实例

模拟instanceof的检测过程

instanceof (A, B) = {

var L = A.__proto__;

var R = B.prototype;

if(L === R) {

return true; // A的内部属性 __proto__ 指向 B 的原型对象

}

return false;

}

instanceof 只能用来判断两个对象是否属于实例关系， 而不能判断一个对象实例具体属于哪种类型。

由此可见instanceof在有些场景下依然不能满足检测具体类型的需求。

toString

toString是Object的原型方法。调用该方法默认返回当前对象的[[class]]

这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。

Object.prototype.toString.call(5) // "[object Number]"

Object.prototype.toString.call('str') // "[object String]"

Object.prototype.toString.call(true) // "[object Boolean]"

Object.prototype.toString.call(undefined) // "[object Undefined]"

Object.prototype.toString.call(null) // "[object Null]"

Object.prototype.toString.call(function(){}) // "[object Function]"

Object.prototype.toString.call([]) // "[object Array]"

Object.prototype.toString.call({}) // "[object Object]"

由上可见toString检测各数据类型算非常准确了，基本上覆盖了我们常用的数据类型

所以是判断数据类型最常用的方法。

这里利用toString写一个检测数据类型的方法

function checkDataType(value) {

const typeObj = Object.prototype.toString.call(value)

return typeObj.slice(8, -1)

}

同时，Array对象提供isArray方法来检测数据是否为数组对象

Array.isArray([1,2,4]) // true

Array.isArray({foo: 'abc'}) // false

该方法用来检测数组类型也是非常方便的。

喜欢的话，公众号记得关注哦，不定时更新前端小技巧哦！！