JS中判断数据类型的四种方法

目录

前言

一.typeof

二.instanceof

 三.Object.prototype.toString.call()

 四.constructor

---

前言

近期回顾了JS的知识，重新梳理一下几种不同的判断数据类型的方式，对于不同的数据类型，可以用不同的判断方式，防止类型判断的不够精确。

一.typeof

typeof可以用来判断number、string、boolean、undefined这四种简单数据类型，以及function这个引用类型(复杂数据类型)。具体写法如下：

typeof  要判断的数据

 测试如下：

    let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(typeof num);//number
    console.log(typeof str);//string
    console.log(typeof true);//boolean
    console.log(typeof undefined);//undefined
    console.log(typeof null);//object
    console.log(typeof fn);//function
    console.log(typeof obj);//object
    console.log(typeof arr);//object
    console.log(typeof (new Date));//object

运行结果：  

可以看见typeof只能识别出number、string、boolean、undefined以及function的具体类型，对于null、array、obj只能识别为obj类型，但不能识别出具体对象类型(Date、Function、Array、Regexp、Number、Object、String、Math、Global、Boolean)。

二.instanceof

instanceof 运算符用于检测构造函数（右边）的 prototype 属性是否出现在某个实例对象（左边）的原型链上。这种方法判断结果返回的是boolean值，并且只能用于对象、数组、函数，不能用于简单数据类型上，具体写法：

要判断的数据 instanceof 数据类型

测试如下： 

let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(num instanceof Number);//false
    console.log(arr instanceof Array);//true
    console.log(fn instanceof Function);//true
    console.log(obj instanceof Object);//true
    console.log((new Date) instanceof Date);//true

运行结果：

 三.Object.prototype.toString.call()

每个对象都有一个 toString() 方法，当该对象被表示为一个文本值时，或者一个对象以预期的字符串方式引用时自动调用。

默认情况下，toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖，toString() 返回 "[object type]"，其中 type 是对象的类型。

由于Object.prototype.toString()本身允许被修改，像Array、Boolean、Number的toString就被重写过，要是想判断传入值的类型，需要把传入值的this，指向Object.prototype ，才能判断传入值的类型,所以需要调用Object.prototype.toString.call(arg)来判断arg的类型，call将arg的上下文指向Object，所以arg执行了Object的toString方法。具体写法：

Object.prototype.toString.call(要判断的数据)

测试如下：

let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
 console.log(Object.prototype.toString.call(num));        // [object Number]
 console.log(Object.prototype.toString.call(str)); // [object String ]
 console.log(Object.prototype.toString.call(true));     // [object Boolean]
 console.log(Object.prototype.toString.call(undefined));  // [object Undefined]
 console.log(Object.prototype.toString.call(fn));   // [object Function]
 console.log(Object.prototype.toString.call(new Date));  // [object Date]
 console.log(Object.prototype.toString.call(null));   // [object Null]
 console.log(Object.prototype.toString.call(arr));  // [object Array]
 console.log(Object.prototype.toString.call(obj));       // [object Object]

运行结果：

 四.constructor

我们可以通过constructor来判断数据的类型，但是除了null、undefined，因为他们不是由对象构建。数字、布尔值、字符串是包装类对象，所以有constructor。constructor是原型对象的属性，指向构造函数。a.constructor==b。判断b是不是a的构造函数。具体写法：

要判断的数据.constructor===数据类型

测试如下：

 let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(num.constructor === Number);  //true
    console.log(str.constructor === String);  //true
    console.log(true.constructor === Boolean);  //true
    console.log(fn.constructor === Function);  //true
    console.log((new Date).constructor === Date);  //true
    console.log(obj.constructor === Object);  //true
    console.log(arr.constructor === Array);  //true

运行结果：

---

参考文档： 【JS 判断数据类型的方法 - CSDN App】http://t.csdnimg.cn/jegqN