判断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 相关文章推荐
HTML代码中标签的全部属性 中文注释说明
Mar 26 Javascript
js判断两个日期是否相等的方法
Sep 10 Javascript
Jquery设置attr的disabled属性控制某行显示或者隐藏
Sep 25 Javascript
JavaScript设计模式之工厂方法模式介绍
Dec 28 Javascript
jQuery实现简易的天天爱消除小游戏
Oct 16 Javascript
JavaScript观察者模式(经典)
Dec 09 Javascript
jQuery事件绑定用法详解
Sep 08 Javascript
AngularJS实现使用路由切换视图的方法
Jan 24 Javascript
jQuery日期范围选择器附源码下载
May 23 jQuery
微信小程序wx.previewImage预览图片实例详解
Dec 07 Javascript
vue同步父子组件和异步父子组件的生命周期顺序问题
Oct 07 Javascript
vue实现同时设置多个倒计时
May 20 Vue.js
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获取本机真实IP地址实例代码
2016/03/31 PHP
PHP实现的统计数据功能详解
2016/12/06 PHP
PHP 断点续传实例详解
2017/11/11 PHP
jquery JSON的解析方式
2009/07/25 Javascript
js 与或运算符 || &amp;&amp; 妙用
2009/12/09 Javascript
Three.js源码阅读笔记(基础的核心Core对象)
2012/12/27 Javascript
关于IE BUG与字符串截取substr的解决办法
2013/04/10 Javascript
Javascript基础知识(三)BOM,DOM总结
2014/09/29 Javascript
Redis基本知识、安装、部署、配置笔记
2015/03/05 Javascript
js获得当前系统日期时间的方法
2015/05/06 Javascript
浅谈jQuery中setInterval()方法
2015/07/07 Javascript
jQuery拖动布局其结果保存到数据库
2015/10/09 Javascript
原生javascript实现的一个简单动画效果
2016/03/30 Javascript
移动端使用localStorage缓存Js和css文的方法(web开发)
2016/09/20 Javascript
AngularJS实现select的ng-options功能示例
2017/07/12 Javascript
详解vue组件开发脚手架
2018/06/15 Javascript
微信小程序实现下拉刷新动画
2019/06/21 Javascript
Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法
2019/09/11 Javascript
Nodejs使用archiver-zip-encrypted库加密压缩文件时报错(解决方案)
2019/11/18 NodeJs
[01:34]2016国际邀请赛中国区预选赛IG战队教练采访
2016/06/27 DOTA
[01:01:35]Optic vs paiN 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
使用C语言扩展Python程序的简单入门指引
2015/04/14 Python
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
Python 记录日志的灵活性和可配置性介绍
2018/02/27 Python
python使用matplotlib绘制雷达图
2019/10/18 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
SEPHORA丝芙兰德国官方购物网站:化妆品、护肤品和香水
2020/01/21 全球购物
乐高瑞士官方商店:LEGO CH
2020/08/16 全球购物
上海中网科技笔试题
2012/02/19 面试题
招聘与培训专员岗位职责
2014/01/30 职场文书
团代会主持词
2014/04/02 职场文书
师德模范事迹材料
2014/06/03 职场文书
办理房产过户的委托书
2014/09/14 职场文书
2015毕业生实习期工作总结
2015/04/09 职场文书
标准版个人借条怎么写?以及什么是借条?
2019/08/28 职场文书
Python爬虫基础之初次使用scrapy爬虫实例
2021/06/26 Python