判断js数据类型的函数实例详解


Posted in Javascript onMay 23, 2019
function judgeType(change) {
    if (arguments.length == 0) {
      return '0';//无参数传入
    }
    if (change === null) {
      return 'null'
    }
    if (change === undefined && arguments.length > 0) {
      return 'undefined'
    }
    if (change instanceof Function) {
      return 'function'
    }
    if (change instanceof Array) {
      return 'arry'
    }
    if (change instanceof Number || typeof change == 'number') {
      return 'number'
    }
    if (change instanceof String || typeof change == 'string') {
      return 'string'
    }
    if (change instanceof Boolean || typeof change == 'boolean') {
      return 'boolean'
    }
  }

ps:下面看下js 判断各种数据类型

了解js的都知道, 有个typeof  用来判断各种数据类型,有两种写法:typeof   xxx   ,typeof(xxx)

       如下实例:

typeof  2   输出  number
    typeof  null  输出  object
    typeof  {}  输出  object
    typeof  []  输出  object
    typeof  (function(){})  输出 function 
    typeof  undefined     输出 undefined
    typeof  '222'         输出  string 
   typeof true          输出   boolean

    这里面包含了js里面的五种数据类型  number   string    boolean   undefined     object和函数类型 function

     看到这里你肯定会问了:我怎么去区分对象,数组和null呢?

     接下来我们就用到另外一个利器:Object.prototype.toString.call

     这是对象的一个原生原型扩展函数,用来更精确的区分数据类型。

     我们来试试这个玩儿意儿:

var  gettype=Object.prototype.toString
    gettype.call('aaaa')    输出   [object String]
    gettype.call(2222)     输出   [object Number]
    gettype.call(true)     输出   [object Boolean]
    gettype.call(undefined) 输出   [object Undefined]
    gettype.call(null)         输出  [object Null]
     gettype.call({})          输出  [object Object]
     gettype.call([])          输出  [object Array]
     gettype.call(function(){})   输出  [object Function]

      看到这里,刚才的问题我们解决了。

     constructor也能判断数据类型:

     如:

''.constructor==String   
      [].constructor==Array
      var obj= new Object()  
  obj.constructor==Object

      其实js 里面还有好多类型判断      [object HTMLDivElement]     div 对象  ,    [object HTMLBodyElement]  body 对象    ,[object Document](IE)或者  [object HTMLDocument](firefox,google) ......各种dom节点的判断,这些东西在我们写插件的时候都会用到。

     可以封装的方法如下  :

var  gettype=Object.prototype.toString
   var  utility={
     isObj:function(o){
        return  gettype.call(o)=="[object Object]";
     },
     isArray:function(o){
        return  gettype.call(o)=="[object Array]";
     },
     isNULL:function(o){
        return  gettype.call(o)=="[object Null]";
     },
     isDocument:function(){
         return  gettype.call(o)=="[object Document]"|| [object HTMLDocument];
     }
     ........
  }

    这个获取类型的方法有个简单的写法:

var Type = (function() {
        var type = {};
        var typeArr = ['String', 'Object', 'Number', 'Array','Undefined', 'Function', 'Null', 'Symbol'];
        for (var i = 0; i < typeArr.length; i++) {
          (function(name) {
            type['Is' + name] = function(obj) {
              return Object.prototype.toString.call(obj) == '[object ' + name + ']';
            }
          })(typeArr[i]);
        }
        return type;
})();

调用方法:Type.IsFunction(function() {})      Type.IsObject({})。。。。。

Type.Is.....

总结

以上所述是小编给大家介绍的判断js数据类型的函数实例详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
jquery购物车实时结算特效实现思路
Sep 23 Javascript
浅析JavaScript中的隐式类型转换
Dec 05 Javascript
随鼠标上下滚动的jquery代码
Dec 05 Javascript
JavaScript模拟实现键盘打字效果
Jun 29 Javascript
JavaScript中this详解
Sep 01 Javascript
基于replaceChild制作简单的吞噬特效
Sep 21 Javascript
浅谈Vue的基本应用
Dec 27 Javascript
jQuery 实时保存页面动态添加的数据的示例
Aug 14 jQuery
JavaScript类型相关的常用操作总结
Feb 14 Javascript
js中apply和call的理解与使用方法
Nov 27 Javascript
js实现星星海特效的示例
Sep 28 Javascript
JavaScript实现表单验证功能
Dec 09 Javascript
JS定义函数的几种常用方法小结
May 23 #Javascript
vue-test-utils初使用详解
May 23 #Javascript
了解前端理论:rscss和rsjs
May 23 #Javascript
微信小程序使用字体图标的方法
May 23 #Javascript
个人小程序接入支付解决方案
May 23 #Javascript
一篇文章介绍redux、react-redux、redux-saga总结
May 23 #Javascript
微信小程序上传图片到php服务器的方法
May 23 #Javascript
You might like
php性能优化分析工具XDebug 大型网站调试工具
2011/05/22 PHP
JpGraph php柱状图使用介绍
2011/08/23 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
php实现通用的从数据库表读取数据到数组的函数实例
2015/03/21 PHP
php常用图片处理类
2016/03/16 PHP
PHP封装的数据库保存session功能类
2016/07/11 PHP
PHP命名空间namespace用法实例分析
2016/09/27 PHP
利用 fsockopen() 函数开放端口扫描器的实例
2017/08/19 PHP
YII2框架中使用RBAC对模块,控制器,方法的权限控制及规则的使用示例
2020/03/18 PHP
JavaScript 异步调用框架 (Part 3 - 代码实现)
2009/08/04 Javascript
JS两种定义方式的区别、内部原理
2013/11/21 Javascript
jquery取子节点及当前节点属性值的方法
2014/09/09 Javascript
jQuery源码解读之hasClass()方法分析
2015/02/20 Javascript
Javascript设计模式之观察者模式的多个实现版本实例
2015/03/03 Javascript
Bootstrap每天必学之折叠(Collapse)插件
2016/04/25 Javascript
jQuery中DOM节点的删除方法总结(超全面)
2017/01/22 Javascript
微信小程序实战之上拉(分页加载)效果(2)
2017/04/17 Javascript
jQuery实现的点击标题文字切换字体效果示例【测试可用】
2018/04/26 jQuery
Vue前端项目部署IIS的实现
2020/01/06 Javascript
JS数组扁平化、去重、排序操作实例详解
2020/02/24 Javascript
[01:58]DOTA2上海特级锦标赛现场采访:RTZ这个ID到底好不好
2016/03/25 DOTA
[05:09]第二届DOTA2亚洲邀请赛决赛日比赛集锦:iG 3:0 OG夺冠
2017/04/05 DOTA
在Python中使用Mako模版库的简单教程
2015/04/08 Python
python3爬取淘宝信息代码分析
2018/02/10 Python
浅谈Pycharm调用同级目录下的py脚本bug
2018/12/03 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
Python 分发包中添加额外文件的方法
2019/08/16 Python
Python网络爬虫四大选择器用法原理总结
2020/06/01 Python
关于python tushare Tkinter构建的简单股票可视化查询系统(Beta v0.13)
2020/10/19 Python
Python爬虫之Selenium库的使用方法
2021/01/03 Python
python 装饰器的基本使用
2021/01/13 Python
利用Canvas模仿百度贴吧客户端loading小球的方法示例
2017/08/13 HTML / CSS
法国美发器材和产品购物网站:Beauty Coiffure
2016/12/05 全球购物
添柏岚英国官方网站:Timberland英国
2019/11/28 全球购物
小学主题班会教案
2015/08/17 职场文书
Python matplotlib绘制条形统计图 处理多个实验多组观测值
2022/04/21 Python