判断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 相关文章推荐
javascript 浏览器检测代码精简版
Mar 04 Javascript
javascript AOP 实现ajax回调函数使用比较方便
Nov 20 Javascript
图片img的src不变让浏览器重新加载实现方法
Mar 29 Javascript
Jquery 模拟用户点击超链接或者按钮的方法
Oct 25 Javascript
jquery选择器之层级过滤选择器详解
Jan 27 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
Jan 19 Javascript
jQuery+json实现的简易Ajax调用实例
Dec 14 Javascript
Bootstrap学习系列之使用 Bootstrap Typeahead 组件实现百度下拉效果
Jul 07 Javascript
Vue2.0实现1.0的搜索过滤器功能实例代码
Mar 20 Javascript
JS库之Highlight.js的用法详解
Sep 13 Javascript
React和Vue中监听变量变化的方法
Nov 14 Javascript
Vue 中文本内容超出规定行数后展开收起的处理的实现方法
Apr 28 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
建立动态的WML站点(一)
2006/10/09 PHP
php使用ICQ网关发送手机短信
2013/10/30 PHP
微信API接口大全
2015/04/15 PHP
PHP仿微信多图片预览上传实例代码
2016/09/13 PHP
php并发加锁示例
2016/10/17 PHP
PHP钩子实现方法解析
2019/05/21 PHP
繁简字转换功能
2006/07/19 Javascript
使用JavaScript库还是自己写代码?
2010/01/28 Javascript
JavaScript去掉数组中的重复元素
2011/01/13 Javascript
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
2011/12/08 Javascript
jQuery插件实现屏蔽单个元素使用户无法点击
2013/04/12 Javascript
解决window.opener=null;window.close(),只支持IE6不支持IE7,IE8的问题
2014/01/14 Javascript
jquery提交form表单简单示例分享
2014/03/03 Javascript
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
2014/07/06 Javascript
JavaScript简单下拉菜单特效
2016/09/13 Javascript
jQuery easyui刷新当前tabs的方法
2016/09/23 Javascript
10分钟掌握XML、JSON及其解析
2020/12/06 Javascript
利用node.js爬取指定排名网站的JS引用库详解
2017/07/25 Javascript
JS实现去除数组中重复json的方法示例
2017/12/21 Javascript
webpack 打包压缩js和css的方法示例
2018/03/20 Javascript
NodeJs之word文件生成与解析的实现代码
2019/04/01 NodeJs
react 移动端实现列表左滑删除的示例代码
2019/07/04 Javascript
基于layui table返回的值的多级嵌套的解决方法
2019/09/19 Javascript
JS 设计模式之:单例模式定义与实现方法浅析
2020/05/06 Javascript
Python中的filter()函数的用法
2015/04/27 Python
Python实现读写sqlite3数据库并将统计数据写入Excel的方法示例
2017/08/07 Python
python使用PIL实现多张图片垂直合并
2019/01/15 Python
python pygame实现方向键控制小球
2019/05/17 Python
详解PyTorch手写数字识别(MNIST数据集)
2019/08/16 Python
python多线程爬取西刺代理的示例代码
2021/01/30 Python
html5使用canvas绘制太阳系效果
2014/12/15 HTML / CSS
先进个人获奖感言
2014/01/24 职场文书
详细的大学生创业计划书模板
2014/01/27 职场文书
教导主任竞聘演讲稿
2014/05/16 职场文书
人身损害赔偿协议书范本
2014/09/27 职场文书
java实现对Hadoop的操作
2021/07/01 Java/Android