js 准确判断数据类型(终极方案)

前言

要判断JavaScript中的数据类型，首先得弄懂JavaScript中有哪些数据类型。然后还要知道在 JavaScript 中可以判断数据类型的有typeof 、instanceof 这些，并且知道其不足，最终通过自己封装的方法来终极解决。

JavaScript中的数据类型有哪些

我把 js 中的数据类型大致分为基本数据类型（原始值）、引用类型这两种。

基本数据类型：

• Number (数值，包括 NaN)
• String (字符串)
• Boolean (布尔类型)
• Undefined (未定义或未初始化)
• Null （空对象）
• Symbol（唯一且不可变，可用做Object属性key）
• BigInt（大整数，可表示容易精度的整型）

引用类型：

• Object 对象
• Array 数组
• Function 函数
• ...

typeof

typeof 运算符返回一个表示数据类型的字符串，用来判断基本数据类型（除 Null 外）

console.log(typeof 1)	        // number
console.log(typeof '1')	        // string
console.log(typeof true)        // boolean
console.log(typeof undefined)	// undefined
console.log(typeof BigInt(1))   // bigint

// 判断 null的时候会返回 object ，这个是js这个语言设计的缺陷
console.log(typeof null)  // object

typeof 缺点是不能正确的判断 null 类型

instanceof

instanceof 只能用来判断构造函数的 prototype 属性能否在某个实例对象的原型链上找到

function Person(name) {
    this.name = name
}

const person1 = new Person('andy hu');

console.log(person1 instanceof Person)	 // true

终极方案：自己封装方法

const getDataType = (value) => {
  if (value == null) return value + '';
  return typeof value === 'function' || typeof value === 'object' ?
    Object.prototype.toString.call(value).match(/^\[object (.+)\]$/)[1].toLowerCase() : typeof value
}

先判断如果是 null 则直接返回 null 字符串，再通过 typeof 判断，如果是基本数据类型（除 null 外）则返回正确类型，然后判断通过 Object.prototype.toString.call() 返回的所有类型都是 [object xx] ，我们只需要截取这个 xx，这个就是数据的真正类型。最后我们通过正则获取到 xx ，因为类型的字符串是小写字母，通过 tolowerCase 转换成小写。这些就能完美解决 typeof 判断数据类型的缺陷了。