判断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 相关文章推荐
另类调用flash无须激活的方法
Dec 27 Javascript
jQuery 自动增长的文本输入框实现代码
Apr 02 Javascript
JavaScript作用域链示例分享
May 27 Javascript
DOM 事件流详解
Jan 20 Javascript
javascript中setInterval的用法
Jul 19 Javascript
jQuery学习心得总结(必看篇)
Jun 10 Javascript
百度地图JavascriptApi Marker平滑移动及车头指向行径方向
Mar 13 Javascript
详解React Native顶|底部导航使用小技巧
Sep 14 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
Jul 26 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
Apr 28 Javascript
vue学习笔记之过滤器的基本使用方法实例分析
Feb 01 Javascript
js面向对象封装级联下拉菜单列表的实现步骤
Feb 08 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
vs中通过剪切板循环来循环粘贴不同内容
2011/04/30 PHP
解析mysql中UNIX_TIMESTAMP()函数与php中time()函数的区别
2013/06/24 PHP
php中函数前加&amp;符号的作用分解
2014/07/08 PHP
PHP采用自定义函数实现遍历目录下所有文件的方法
2014/08/19 PHP
从零开始学YII2框架(三)扩展插件yii2-gird
2014/08/20 PHP
PHP计算指定日期所在周的开始和结束日期的方法
2015/03/24 PHP
使用PHP进行微信公众平台开发的示例
2015/08/21 PHP
javascript 写类方式之九
2009/07/05 Javascript
Extjs中DisplayField的日期或者数字格式化扩展
2010/09/03 Javascript
js螺旋动画效果的具体实例
2013/11/15 Javascript
jQuery中:file选择器用法实例
2015/01/04 Javascript
JS实现三级折叠菜单特效,其它级可自动收缩
2015/08/06 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
2016/04/12 Javascript
EasyUI 结合JS导出Excel文件的实现方法
2016/11/10 Javascript
vue中Npm run build 根据环境传递参数方法来打包不同域名
2018/03/29 Javascript
原生JS实现旋转轮播图+文字内容切换效果【附源码】
2018/09/29 Javascript
Vue实现push数组并删除的例子
2019/11/01 Javascript
JavaScript实现多个物体同时运动
2020/03/12 Javascript
详解js中的原型,原型对象,原型链
2020/07/16 Javascript
js实现简易ATM功能
2020/10/27 Javascript
python线程池的实现实例
2013/11/18 Python
Python THREADING模块中的JOIN()方法深入理解
2015/02/18 Python
用Python实现服务器中只重载被修改的进程的方法
2015/04/30 Python
基于pandas将类别属性转化为数值属性的方法
2018/07/25 Python
基于Python实现ComicReaper漫画自动爬取脚本过程解析
2019/11/11 Python
python向图片里添加文字
2019/11/26 Python
python3 BeautifulSoup模块使用字典的方法抓取a标签内的数据示例
2019/11/28 Python
Python数组并集交集补集代码实例
2020/02/18 Python
用什么库写 Python 命令行程序(示例代码详解)
2020/02/20 Python
应届电子商务毕业自荐书范文
2014/02/11 职场文书
婚礼新人答谢词
2015/01/04 职场文书
工作失误检讨书范文
2015/01/26 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
主持人开场白台词
2015/05/29 职场文书
2015年教师节感言
2015/08/03 职场文书
2015秋季田径运动会广播稿
2015/08/19 职场文书