js 判断数据类型

1,164 阅读1分钟

如何判断数据类型?怎么判断一个值到底是数组类型还是对象?

方法一:

typeof(慎用)

typeof 'seymoe'    // 'string'
typeof true        // 'boolean'
typeof 10          // 'number'
typeof Symbol()    // 'symbol'
typeof null        // 'object' 无法判定是否为 null
typeof undefined   // 'undefined'

typeof {}           // 'object'
typeof []           // 'object'
typeof(() => {})    // 'function'

只有‘boolean’、‘number’、’string’、‘function’四种类型是靠谱儿的

可以配合Array.isArray()使用

Array.isArray 也可以判断传递参数是否是数组。 需要注意的是这是 Array.isArray 是 ES 5.1 推出的,不支持 IE6~8

方法二:

instanceof(慎用)

[] instanceof Array            // true
({}) instanceof Object         // true
(()=>{}) instanceof Function   // true

let arr = []
let obj = {}
arr instanceof Array    // true
arr instanceof Object   // true
obj instanceof Object   // true
obj instanceof Array   // false

通过 instanceof 操作符也可以对对象类型进行判定,其原理就是测试构造函数的prototype 是否出现在被检测对象的原型链上。

instanceof简单说就是判断一个引用类型的变量具体是不是某种类型的对象
仍然不能准确判断数组和对象
instanceof 和 typeof 都可以用于基本数据类型判断

方法三:

Object.prototype.toString()(推荐)

Object.prototype.toString.call({})              // '[object Object]'
Object.prototype.toString.call([])              // '[object Array]'
Object.prototype.toString.call(() => {})        // '[object Function]'
Object.prototype.toString.call('seymoe')        // '[object String]'
Object.prototype.toString.call(1)               // '[object Number]'
Object.prototype.toString.call(true)            // '[object Boolean]'
Object.prototype.toString.call(Symbol())        // '[object Symbol]'
Object.prototype.toString.call(null)            // '[object Null]'
Object.prototype.toString.call(undefined)       // '[object Undefined]'

Object.prototype.toString.call(new Date())      // '[object Date]'
Object.prototype.toString.call(Math)            // '[object Math]'
Object.prototype.toString.call(new Set())       // '[object Set]'
Object.prototype.toString.call(new WeakSet())   // '[object WeakSet]'
Object.prototype.toString.call(new Map())       // '[object Map]'
Object.prototype.toString.call(new WeakMap())   // '[object WeakMap]'
  • 该方法本质就是依托Object.prototype.toString()方法得到对象内部属性 [[Class]]
  • 传入原始类型却能够判定出结果是因为对值进行了包装
  • null 和 undefined 能够输出结果是内部实现有做处理 因此:
**
 * 判断一个变量哪种类型
 * @param {*} obj - 待判断变量
 * @returns {string} 类型名称
 */
export function typeOf(obj) {
  return toString.call(obj).slice(8, -1).toLowerCase()
}