• JavaScript判断数据类型的方法


    1. 利用运算符typeof或者typeof()方法
      
      
             //基本类型
              console.log(typeof 1);              //1
              console.log(typeof true);           //boolean
              console.log(typeof undefined);      //undefined
              console.log(typeof 'string');       //string
              console.log(typeof null);           //object
              console.log(typeof Symbol());       //symbol
              console.log(typeof 33n);            //bigint
              //对象类型
              console.log(typeof []);             //object
              console.log(typeof function(){});   //function
              console.log(typeof {});             //object
              console.log(typeof new Set([1,2,3]));//object
              console.log(typeof new Map([['o',1]]));//object
              console.log(typeof p1);                 //object    
       

      由此可以看出typeof运算符值对原始数据类型有用,对于对象数据类型就并没有那么准确

    2. instanceof运算符
      console.log(1 instanceof Number);       //false
      console.log('str' instanceof String);   //false
      console.log([] instanceof Array);       //true
      console.log([] instanceof Object);      //true   

      首先,我们知道instanceof运算符是判断构造函数的prototype是否出现在实例的原型链上面,因此,此方法并不太适用判断数据类型

    3. constructor属性
      //原始数据类型
              console.log((1).constructor);        //ƒ Number() { [native code] }
              console.log('str'.constructor);      //ƒ String() { [native code] }
              console.log(true.constructor);      //ƒ Boolean() { [native code] }
              console.log(null.constructor);      // 报错
              console.log(undefined.constructor);  //报错
              console.log((88n).constructor);        //ƒ BigInt() { [native code] }
              console.log(Symbol().constructor);      //ƒ Symbol() { [native code] }
       //对象数据类型
              console.log([].constructor);        //ƒ Array() { [native code] }
              console.log(function(){}.constructor);        //ƒ Function() { [native code] }
              console.log({}.constructor);        //ƒ Object() { [native code] }
              console.log(new Set([1,2,3]).constructor);        //ƒ Set() { [native code] }
              console.log(new new Map([['o',1]]).constructor);        //Map(0) {}

      虽然看似很完美BUT。。。。

      console.log(Number.prototype.constructor);  //ƒ Number() { [native code] }
      console.log(String.prototype.constructor);  //ƒ String() { [native code] }

      由于constructor属性是定义在对象的原型上面,所以原型对象的constructor属性也直接指向构造函数

    4. 借用Object原型里的一个方法 :Object.prototype.toString.call(对象)
          console.log(Object.prototype.toString.call(null));//[object Null]
          console.log(Object.prototype.toString.call(undefined)); //[object Undefined]
          console.log(Object.prototype.toString.call(true)); //[object Boolean]
          console.log(Object.prototype.toString.call('str'));//[object String]
          console.log(Object.prototype.toString.call(11));//[object Number]
          console.log(Object.prototype.toString.call(function(){}));//[object Function]
          console.log(Object.prototype.toString.call([]));//[object Array]
          console.log(Object.prototype.toString.call({}));//[object Object]
          console.log(Object.prototype.toString.call(new Set([4,5,6])));  //[object Set]

      此方法相对来说还是比较完美,但是要注意一定是从Object.prototype.toString用call方法借用才行

  • 相关阅读:
    day09总结
    day09作业
    删除循环中选中的id
    数组套数组 获取数据
    vue for each循环出来数组的某一项 再重新合并成一个新数组
    全是没见过的
    vue element 分页
    解决iphonex屏幕过长背景图片或者放在元素里面的图片不能铺满的问题
    实在自动现在APK,微信跳浏览器下载
    js判断是否在微信浏览器中打开
  • 原文地址:https://www.cnblogs.com/xincheng-1999/p/14043342.html
Copyright © 2020-2023  润新知