JavaScript数据类型的检测

55 阅读2分钟

一、数据类型

数据类型形式
布尔类型boolean
字符串类型string
数值类型number(整数、浮点数、科学计数法、NaN)
undefinedundefined
nullobject(数组、对象)
函数function
在JavaScript中,NaN、整数、浮点数、数据类型结果是相同的
  • 定义一些常用的数据类型
        let num = 111; // 数字类型
        let str = "Hello"; // 字符串类型
        let boolean = false; // 布尔类型
        let arr = []; // 数组类型
        let obj = {}; // 对象类型
        let testFunction = function () {}; // 函数类型
        let testClass = class {}; // 类
    

二、typeof()

  • 语法:typeof(变量) 或者 typeof 变量
  • 查看变量中存储数据的数据类型,输出数据类型结果
  • 注意:typeof语法,不能完全准确的判断数据的数据类型
          console.log(typeof num); //number
          console.log(typeof str); //string
          console.log(typeof bool); //boolean
          console.log(typeof undefined); //undefined
          console.log(typeof null); //object
    
          console.log(typeof arr); //object
          console.log(typeof obj); // object
          console.log(typeof testFunction); //function
          console.log(typeof testClass); //function
    
    • typeof操作符判断基本数据类型是准确的,但是对于复杂数据类型的判断是模糊的、不准确的
    • 注意:typeof null的返回值是object

三、 instanceof()

  • instanceof的返回值只有两种,分别是true或false。
  • 判断的方式a instanceof b,判断a是否在b的实例上,即判断在b的原型对象上是否能找到a,能找到就会返回true,反之则返回false。
  • 只能判断引用数据类型,不能判断基本数据类型
  • 值得注意的是,undefined和null并不属于object
        console.log(num instanceof Number); //false
        console.log(str instanceof String); //false
        console.log(bool instanceof Boolean); //false
        console.log(undefined instanceof Object); //false
        console.log(null instanceof Object); //false
    
        console.log(obj instanceof Object); //true
        console.log(arr instanceof Array); //true
        console.log(testFunction instanceof Function); //true
        console.log(testClass instanceof Function); //true
    

四、constructor

  • constructor检测数据类型返回的是检测对象的构造函数。
  • 判断方式为xxx.constructor。xxx代指检测对象。
  • 几乎可以判断基本数据类型和引用数据类型;
  • 当我们更改原型对象时,也会导致检测不准确
        console.log(num.constructor); //ƒ Number() { [native code] }
        console.log(str.constructor); //ƒ String() { [native code] }
        console.log(bool.constructor); //ƒ Boolean() { [native code] }
    
        console.log(arr.constructor); //ƒ Array() { [native code] }
        console.log(obj.constructor); //ƒ Object() { [native code] }
        console.log(testFunction.constructor); //ƒ Function() { [native code] }
        console.log(testClass.constructor); //ƒ Function() { [native code] }
    
       let num = 111;
        console.log(num.constructor); //ƒ Number() { [native code] }
        Number.prototype.constructor = Array.prototype.constructor; //修改原型对象
        console.log(num.constructor); // ƒ Array() { [native code] }
        console.log(num.constructor == Number); // false
        console.log(num.constructor == Array); // true
    

五、Object.prototype.toString.call()

  • 可以检测所有数据类型
        console.log(Object.prototype.toString.call(num)); // [object Number]
        console.log(Object.prototype.toString.call(str)); //[object String]
        console.log(Object.prototype.toString.call(bool)); //[object Boolean]
    
        console.log(Object.prototype.toString.call(arr)); //[object Array]
        console.log(Object.prototype.toString.call(obj)); //[object Object]
        console.log(Object.prototype.toString.call(testFunction)); //[object Function]
        console.log(Object.prototype.toString.call(new testClass())); //[object Object]
        console.log(Object.prototype.toString.call(new Date())); //[object Date]
        console.log(Object.prototype.toString.call(Math)); //[object Math]
    
  • 实际项目中,有更加准确的判断数据类型的语法 Objcet.prototype.toString.call(数据)