乐趣区

js类型检测的几种方式盘点

开始之前,必须要知道 js 中关于类型的定义。js 中有 6 种基本类型,null,undefined,boolean,string,number,symbol(es6 新增的类型)。还有一种引用类型(复杂类型)是 object。像是 {},function 函数,[] 数组都是对象。

首先,先定义几种 object 类型

  var obj = {};
  function fun(){};
  var arr = [];

1.typeof

    console.log(typeof null);  //object
    console.log(typeof fun);  //function
    console.log(typeof obj);  //object
    console.log(typeof arr);  //object
    console.log(typeof "abc");  //string
    console.log(typeof 23);  //number
    console.log(typeof false);  //boolean

返回值类型:string
总结:一般只用来检测基本数据类型。function 能正确返回,像是数组和对象都只会返回 object。null 作为基本类型也返回 object,因为 null 在 js 中的定义就是用来表示一个空对象指针。

2.instanceof

    console.log("string" instanceof String);  //false
    console.log(23 instanceof Number);  //false
    console.log(false instanceof Boolean);  //false
    console.log(null instanceof Object);  //false
    console.log(obj instanceof Object);  //true
    console.log(fun instanceof Object);  //true
    console.log(fun instanceof Function);  //true
    console.log(obj instanceof Function);  //false
    console.log(arr instanceof Object);  //true
    console.log(arr instanceof Array);  //true

返回值类型:boolean
总结:一般用来检测 object,无法正确检测基本数据类型。但是注意,因为 function 和 array 都是 object 类型。除了相对应的 Function 和 Array 会返回 true 以外,instanceof Object 也会返回 true。

3.constructor

    console.log(obj.constructor == Object);  //true
    console.log(arr.constructor == Object);  //false
    console.log(arr.constructor == Array);  //true
    console.log(arr.constructor === Array);  //true
    console.log(fun.constructor == Object);  //false
    console.log(fun.constructor == Function);  //true
    console.log(fun.constructor === Function);  //true
    console.log("fun".constructor == String);  //true
    console.log(false.constructor == Boolean);  //true

返回值类型:boolean
总结:constructor(构造函数)检测,这是我觉得最好的检测方式了。能正确判断是那种基本类型和那种 object 类型。而且通过 constructor 和 prototype(原型)在有些时候能用来判断两个对象是否相等。

4.Object.prototype.toString.call()

    console.log(Object.prototype.toString.call("rerqw"));  //[object String]
    console.log(Object.prototype.toString.call(16));  //[object Number]
    console.log(Object.prototype.toString.call(false));  // [object Boolean]
    console.log(Object.prototype.toString.call(null));  //[object Null]
    console.log(Object.prototype.toString.call(undefined));  //[object Undefined]
    console.log(Object.prototype.toString.call(fun));  //[object Function]
    console.log(Object.prototype.toString.call(arr));  //[object Array]
    console.log(Object.prototype.toString.call(obj));  //[object Object]

返回值类型:string
总结:这也是比较好的返回方式了。虽然返回的样式怪怪的。但是能正确返回基本类型和各种 object 类型。

5.Object.prototype.toString.apply()

用法和上面 Object.prototype.toString.call()一样,就是 call 换成 apply。返回结果也一样。
至于为什么 call 和 apply 实现效果一样。又是另一个更复杂的问题,改天我会写一篇文章,详细分析 apply(),call(),bind()三种方法。会回来贴上地址的。

退出移动版