文档章节

JS 类型检测

DannyTam
 DannyTam
发布于 2015/01/07 22:25
字数 508
阅读 16
收藏 0

JS 判断类型

1. typeof

适合基本类型和function 检测,遇到null失败

2. instanceof

适合自定义对象,也可以用来检测原生对象,在不同的window以及iframe间检测时失效 

3. Object.prototype.toString.apply()

适合内置对象和基本元素,遇到null和undefined失效

//Object.prototype.toString.apply(null) 在IE6/7/8下返回"[object Object]"

4. constructor

5. duck type


<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb18030">
    <title>Untitled Document</title>
    
</head>
<body>
    <script type="text/javascript">   
        function getType(obj) {
            var retType ;
            if(null === obj) {
                retType = 'null';
            } else if('object' === typeof obj) {
                //String/Boolean/Number/Date/window
                var typeStr = Object.prototype.toString.apply(obj);
                retType = typeStr.substring(8, typeStr.length - 1);
            } else {
                retType = typeof obj;
            }
            
            return retType.toUpperCase();
        }
        /*
         * param1 Array 
         * param2 Array
         * return true or false
         */
        function judgeArrayWithoutOrder(arr1, arr2) {
            var len1 = arr1.length,
                len2 = arr2.length;
            if(len1 != len2) return false;
            
            var markArr = [];
            for(var i = 0; i < len1; i ++){
                markArr.push(true);
            }
            var sameCount = 0;
            for(var i = 0; i < len1; i ++){
                var arr1Itr = arr1[i];
                for(var j = 0; j < len1; j ++){
                    if(markArr[j]) {
                        if(arr1Itr == arr2[j]) {
                            markArr[j] = false;
                            sameCount ++;
                            break;
                        }
                    }
                }
            }
            return sameCount == len1;
        }
        /*
         * param1 Array 
         * param2 Array
         * return true or false
         */
        function arraysSimilar(arr1, arr2){
            if('ARRAY' != getType(arr1) || 'ARRAY' != getType(arr2)) {
                return false;
            }
            var len1 = arr1.length,
                len2 = arr2.length;
            if(len1 != len2) return false;
            
            var arr1Types = [],
                arr2Types = [];
            
            for(var i = 0; i < len1; i ++) {
                arr1Types.push(getType(arr1[i]));
                arr2Types.push(getType(arr2[i]));
            }
            return judgeArrayWithoutOrder(arr1Types, arr2Types);
        }
    </script>
    <script src="testData.js"></script>
</body>
</html>


TestData.js

var result=function(){
    //以下为多组测试数据
            var cases=[{
                    arr1:[1,true,null],
                    arr2:[null,false,100],
                    expect:true
                },{
                    arr1:[function(){},100],
                    arr2:[100,{}],
                    expect:false
                },{
                    arr1:[null,999],
                    arr2:[{},444],
                    expect:false
                },{
                    arr1:[window,1,true,new Date(),"hahaha",(function(){}),undefined],
                    arr2:[undefined,(function(){}),"okokok",new Date(),false,2,window],
                    expect:true
                },{
                    arr1:[new Date()],
                    arr2:[{}],
                    expect:false
                },{
                    arr1:[window],
                    arr2:[{}],
                    expect:false
                },{
                    arr1:[undefined,1],
                    arr2:[null,2],
                    expect:false
                },{
                    arr1:[new Object,new Object,new Object],
                    arr2:[{},{},null],
                    expect:false
                },{
                    arr1:null,
                    arr2:null,
                    expect:false
                },{
                    arr1:[],
                    arr2:undefined,
                    expect:false
                },{
                    arr1:"abc",
                    arr2:"cba",
                    expect:false
                }];
            
    //使用for循环, 通过arraysSimilar函数验证以上数据是否相似,如相似显示“通过”,否则"不通过",所以大家要完成arraysSimilar函数,具体要求,详见任务要求。    
            for(var i=0;i<cases.length;i++){
                if(arraysSimilar(cases[i].arr1,cases[i].arr2)!==cases[i].expect) {
                    document.write("不通过!case"+(i+1)+"不正确!arr1="+JSON.stringify(cases[i].arr1)+", arr2="+JSON.stringify(cases[i].arr2)+" 的判断结果不是"+cases[i].expect);
                    return false;
                }                
            }
            return true;
            
        }();
    document.write("判定结果:"+(result?"通过":"不通过"));





© 著作权归作者所有

DannyTam
粉丝 4
博文 111
码字总数 58790
作品 0
深圳
程序员
私信 提问
判断javascript数组的方法

判断javascript数组的方法 var is_array=function(){ return value && } 我们知道,javascript是一种弱类型的语言,并且,javascript中的一切实质上都是对象。那么,在javascript中如何进行对...

首席xx师
2013/06/06
100
2
【摘】【编写可维护的JavaScript】判断javascript中的类型

判断javascript中的类型--编写维护的JavaScript 检测原始值 你希望一个值是字符串、数字、布尔值或undefined,最佳选择是使用typeof运算符 typeof运算符的独特之处在于,将其用于一个未声明的...

jackzlz
2015/08/23
105
0
说说javascript变量类型和变量类型检测

javascript是一种弱类型语言,它的典型例子就是即变量在使用的时候可以给它赋值任何类型。那么先来看下javascript都有那些变量类型已经它们的使用方法吧。 先来看看javascript都有那些类型吧...

开源中国最帅没有之一
2014/10/16
163
0
TypeScript VS JavaScript 深度对比

TypeScript 和 JavaScript 是目前项目开发中较为流行的两种脚本语言,我们已经熟知 TypeScript 是 JavaScript 的一个超集,但是 TypeScript 与 JavaScript 之间又有什么样的区别呢?在选择开...

powertoolsteam
2018/06/29
0
0
我认为一些必知的JavaScript基础知识

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。 JS作用:表单验证,减轻服务端的压力;添加页面动画效果;动态更改页面内容;Ajax网络请求。 下面简...

peakedness丶
2018/11/02
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Spring使用ThreadPoolTaskExecutor自定义线程池及实现异步调用

多线程一直是工作或面试过程中的高频知识点,今天给大家分享一下使用 ThreadPoolTaskExecutor 来自定义线程池和实现异步调用多线程。 一、ThreadPoolTaskExecutor 本文采用 Executors 的工厂...

CREATE_17
今天
5
0
CSS盒子模型

CSS盒子模型 组成: content --> padding --> border --> margin 像现实生活中的快递: 物品 --> 填充物 --> 包装盒 --> 盒子与盒子之间的间距 content :width、height组成的 内容区域 padd......

studywin
今天
7
0
修复Win10下开始菜单、设置等系统软件无法打开的问题

因为各种各样的原因导致系统文件丢失、损坏、被修改,而造成win10的开始菜单、设置等系统软件无法打开的情况,可以尝试如下方法解决 此方法只在部分情况下有效,但值得一试 用Windows键+R打开...

locbytes
昨天
8
0
jquery 添加和删除节点

本文转载于:专业的前端网站➺jquery 添加和删除节点 // 增加一个三和一节点function addPanel() { // var newPanel = $('.my-panel').clone(true) var newPanel = $(".triple-panel-con......

前端老手
昨天
8
0
一、Django基础

一、web框架分类和wsgiref模块使用介绍 web框架的本质 socket服务端 与 浏览器的通信 socket服务端功能划分: 负责与浏览器收发消息(socket通信) --> wsgiref/uWsgi/gunicorn... 根据用户访问...

ZeroBit
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部