判断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 22 Javascript
网页右下角弹出窗体实现代码
Jun 05 Javascript
node.js中的fs.write方法使用说明
Dec 15 Javascript
javascript如何操作HTML下拉列表标签
Aug 20 Javascript
confirm确认对话框的实现方法总结
Jun 17 Javascript
使用Vue写一个datepicker的示例
Jan 27 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
Aug 14 jQuery
JS数组实现分类统计实例代码
Sep 30 Javascript
vue轻量级框架无法获取到vue对象解决方法
May 12 Javascript
js神秘的电报密码 哈弗曼编码实现
Sep 10 Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 Vue.js
jquery插件实现悬浮的菜单
Apr 24 jQuery
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
高分R级DC动画剧《哈莉·奎茵》第二季正式预告首发
2020/04/09 欧美动漫
Smarty使用自定义资源的方法
2015/08/08 PHP
使用新的消息弹出框blackbirdjs
2008/10/16 Javascript
响应鼠标变换表格背景或者颜色的代码
2009/03/30 Javascript
多次注册事件会导致一个事件被触发多次的解决方法
2013/08/12 Javascript
多种方式实现JS调用后台方法进行数据交互
2013/08/20 Javascript
js charAt的使用示例
2014/02/18 Javascript
Js表格万条数据瞬间加载实现代码
2014/02/20 Javascript
JavaScript学习小结(一)——JavaScript入门基础
2015/09/02 Javascript
不用一句js代码初始化组件
2016/01/27 Javascript
使用AJAX实现Web页面进度条的实例分享
2016/05/06 Javascript
Node.js的Web模板引擎ejs的入门使用教程
2016/06/06 Javascript
前端框架Vue.js构建大型应用浅析
2016/09/12 Javascript
jquery 抽奖小程序实现代码
2016/10/12 Javascript
JavaScript 监控微信浏览器且自带返回按钮时间
2016/11/27 Javascript
vue2.0与bootstrap3实现列表分页效果
2017/11/28 Javascript
解决vue router组件状态刷新消失的问题
2018/08/01 Javascript
小程序图片长按识别功能的实现方法
2018/08/30 Javascript
vue实现在线翻译功能
2019/09/27 Javascript
vue视频播放暂停代码
2019/11/08 Javascript
vue 中几种传值方法(3种)
2019/11/12 Javascript
用VsCode编辑TypeScript的实现方法
2020/05/07 Javascript
微信小程序自定义底部弹出框动画
2020/11/18 Javascript
Python计算两个日期相差天数的方法示例
2017/05/23 Python
python中的协程深入理解
2019/06/10 Python
python opencv 简单阈值算法的实现
2019/08/04 Python
pycharm工具连接mysql数据库失败问题
2020/04/01 Python
Python collections.deque双边队列原理详解
2020/10/05 Python
批评与自我批评发言稿
2014/10/15 职场文书
失职检讨书大全
2015/01/26 职场文书
兵马俑的导游词
2015/02/02 职场文书
培训计划通知
2015/07/15 职场文书
给学校的建议书400字
2015/09/14 职场文书
看看如何用Python绘制小米新版天价logo
2021/04/20 Python
pytorch 权重weight 与 梯度grad 可视化操作
2021/06/05 Python
Python matplotlib 利用随机函数生成变化图形
2022/04/26 Python