JavaScript判断数据的类型

注：纯手打，如有错误欢迎评论区交流！
转载请注明出处：https://blog.youkuaiyun.com/testleaf/article/details/147954653
编写此文是为了更好地学习前端知识，如果损害了有关人的利益，请联系删除！
本文章将不定时更新，敬请期待！！！
欢迎点赞、收藏、转发、关注，多谢！！！

一、typeof：判断基本类型

​​特点​​：能识别基本类型（除 null 外），但对引用类型返回 object。

typeof 'hello'      // 'string'
typeof 42           // 'number'
typeof true         // 'boolean'
typeof undefined    // 'undefined'
typeof Symbol()     // 'symbol'
typeof BigInt(10)   // 'bigint'
typeof function(){} // 'function'

// 局限性
typeof null         // 'object' （历史遗留问题）
typeof []           // 'object'
typeof {}           // 'object'

二、instanceof：判断实例原型链

​​特点​​：检查对象是否是某个构造函数的实例（对基本类型无效）。

[] instanceof Array      // true
{} instanceof Object     // true
new Date() instanceof Date // true

// 局限性
'abc' instanceof String  // false （基本类型不适用）
null instanceof Object   // false

三、Object.prototype.toString.call()：终极方案

​​特点​​：精准识别所有类型（推荐）。

Object.prototype.toString.call('hello')   // '[object String]'
Object.prototype.toString.call(42)        // '[object Number]'
Object.prototype.toString.call(true)      // '[object Boolean]'
Object.prototype.toString.call(null)      // '[object Null]'
Object.prototype.toString.call(undefined) // '[object Undefined]'
Object.prototype.toString.call([])        // '[object Array]'
Object.prototype.toString.call({})        // '[object Object]'
Object.prototype.toString.call(/regex/)   // '[object RegExp]'
Object.prototype.toString.call(new Date())// '[object Date]'

封装成通用函数​​：

function getType(obj) {
  return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}
getType([]) // 'array'
getType(null) // 'null'

四、专门方法判断特定类型

1、判断数组

Array.isArray([]) // true

2、判断 NaN

Number.isNaN(NaN) // true （注意：全局 isNaN() 会先尝试转数字）

3、判断 null 或 undefined

value === null      // 仅判断 null
value === undefined // 仅判断 undefined
value == null       // 同时判断 null 或 undefined

五、ES6+ 新增类型判断

1、Map/Set/WeakMap/WeakSet

Object.prototype.toString.call(new Map())    // '[object Map]'
Object.prototype.toString.call(new Set())    // '[object Set]'

2、Promise

Object.prototype.toString.call(Promise.resolve()) // '[object Promise]'

3、自定义类

class MyClass {}
Object.prototype.toString.call(new MyClass()) // '[object Object]' （需自定义 toStringTag）

六、特殊案例处理

1、区分对象和数组

function isObject(obj) {
  return obj !== null && typeof obj === 'object' && !Array.isArray(obj);
}

2、判断纯对象（Plain Object）

function isPlainObject(obj) {
  return Object.prototype.toString.call(obj) === '[object Object]' &&
         Object.getPrototypeOf(obj) === Object.prototype;
}
isPlainObject({})     // true
isPlainObject([])     // false
isPlainObject(new Date()) // false

七、终极方案对比表

方法	适用场景	局限性
typeof	基本类型（除 null）	null 返回 object
instanceof	引用类型（检查构造函数）	不适用于基本类型
Object.prototype.toString	​​所有类型​​（最精准）	无
Array.isArray()	仅判断数组	仅适用于数组
=== null 或 === undefined	精确判断 null/undefined	仅适用于这两个值

八、实际应用示例

function typeCheck(value) {
  const type = Object.prototype.toString.call(value).slice(8, -1);
  switch (type) {
    case 'String':
    case 'Number':
    case 'Boolean':
    case 'Null':
    case 'Undefined':
    case 'Symbol':
    case 'BigInt':
      return type.toLowerCase();
    default:
      return type; // 'Array', 'Object', 'Date', 'RegExp' 等
  }
}

typeCheck(null)      // 'null'
typeCheck([])        // 'Array'
typeCheck(new Date())// 'Date'

九、总结

1、​​基本类型​​：优先用 typeof（注意 null 的坑）。
​​2、引用类型​​：用 Object.prototype.toString.call()。
​​3、数组​​：直接用 Array.isArray()。
4、​​特殊值​​：null 和 undefined 用 === 严格判断。
5、​​ES6+ 类型​​：结合 toString 和专用方法（如 Promise.resolve()）。