js中判断数据类型的方法

1.数据类型有哪些

• 基本数据类型：Number、String、Boolean、Null、 Undefined、Symbol(es6)、BigInt(es6)
• 引用数据类型：Object(Array、Function、Date、RegExp)

2.判断数据类型的方法

2.1 typeof

typeof 返回值 “object” 、“number”、“boolean”、“undefined”、“function” 、“string”、“function”、“symbol”

原理

不同的对象在底层都表示为二进制，在Javascript中二进制前（低）三位存储其类型信息。

000: 对象
010: 浮点数
100：字符串
110： 布尔
1： 整数
typeof null 为"object", 原因是因为 不同的对象在底层都表示为二进制，在Javascript中二进制前（低）三位都为0的话会被判断为Object类型，null的二进制表示全为0，自然前三位也是0，所以执行typeof时会返回"object"。

基本用法

typeof 1          // number
typeof true       // boolean
typeof 'str'     // string
typeof Symbol(C)  // symbol
typeof undefined  // undefined
typeof null       // object
function A() {
    return 1
}
typeof A          //function

typeof 只能准确判断除 null 以外的基本数据类型

2.2 instanceof

instanceof 是用来 判断数据是否是某个对象的实例，返回一个布尔值

基本用法

// 判断 obj 是否为 Object 的实例
function Person(name) {
 this.name = name
}
const p = new Person('Jack')
p instanceof Person // true

// 这里的 p 是 Person 函数构造出来的，所以顺着 p 的原型链可以找到Object的构造函数
p.__proto__ === Person.prototype // true
p.__proto__.__proto__ === Object.prototype // true

缺点

对于基本类型的数据，instanceof是不能直接判断它的类型的，因为实例是一个对象或函数创建的，是引用类型，所以需要通过基本类型对应的包装对象 来判断。所以对于 null 和 undefined就无法检测

5 instanceof Number // false
new Number(5) instanceof Number  // true

因为原型链继承的关系，instanceof 会把数组都识别为 Object 对象，所有引用类型的祖先都是 Object 对象

let arr = [1, 2]
console.log(Object.prototype.toString.call(arr) === '[object Array]') // true
console.log(arr instanceof Array) // true
console.log(arr instanceof Object) // true
let fn = function(){}
console.log(fn instanceof Object)  // true

手写instanceof

instanceof的核心原理是：用来检测某个实例对象的原型链上是否存在构造函数的 prototype 属性

function myInstanceof(instanceObj, constructorFun) {
  const prototypeObj = constructorFun.prototype // 获取构造函数的原型对象（显示原型）
  instanceObj = instanceObj.__proto__ // 获取实例对象的原型（隐式原型）
  // 循环进行查找原型 直到 Object.prototype.__proto__  === null
  while (instanceObj) {
    if (prototypeObj === instanceObj) {
      return true
    }
    instanceObj = instanceObj.__proto__ // 重点(核心)：层层向上遍历
  }
  return false
}

myInstanceof('', String) // true
myInstanceof(1, String) // false

function Person(name) {
 this.name = name
}
const p = new Person('Jack')
myInstanceof(p, Person) // true

• instanceof 可以检测所有能转换为实例对象的数据
• instanceof 不能直接判断基本书籍类型

2.3 constructor

使用 constructor 可以查看目标构造函数，也可以进行数据类型判断。但是不能判断 null 和 undefined，因为这两个特殊类型没有其对应的包装对象。constructor和instanceof 类似，constructor 返回结果的是自己的构造函数，而 instructor 则是自己与构造函数比较返回布尔值
创建的每个函数都有一个prototype（原型）对象，这个属性是一个指针，指向一个对象。在默认情况下，所有原型对象都会自动获得一个constructor（构造函数）属性，这个属性是一个指向prototype属性所在函数的指针。当调用构造函数创建一个新实例后，该实例的内部将包含一个指针（继承自构造函数的prototype），指向构造函数的原型对象。注意当将构造函数的prototype设置为等于一个以对象字面量形式创建的新对象时，constructor属性不再指向该构造函数。

基本用法

(5).constructor === Number     // true
"text".constructor === String  // true
true.constructor === Boolean   // true
({}).constructor === Object    // true
console.log({} instanceof Object) // true

// Uncaught TypeError: Cannot read property 'constructor' of undefined
undefined.constructor === undefined  // 报错
null.constructor === null            // 报错

2.4 Object.prototype.toString

在判断数据类型时，我们称 Object.prototype.toString 为 “万能方法” “终极方法”，工作中也是比较常用而且准确

基本用法

Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"
Object.prototype.toString.call(function(){}) // "[object Function]"
Object.prototype.toString.call('') // "[object String]"
Object.prototype.toString.call(1) // "[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 Undefined]"
Object.prototype.toString.call(new Date()) // "[object Date]"
Object.prototype.toString.call(/at/) // "[object RegExp]"

参考链接