当前位置:首页 > 开发 > Web前端 > JavaScript > 正文

javascript中的类型判断

发表于: 2015-06-28   作者:zhangzhaoaaa   来源:转载   浏览:
摘要:       在前端开发中,我们经常会遇到变量类型的判断,今天总结一下,以防老忘记某些类型的判断。        <!DOCTYPE html> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"&g

      在前端开发中,我们经常会遇到变量类型的判断,今天总结一下,以防老忘记某些类型的判断。

      

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    </head>
    <body>
        <!--[if lt IE 7]>
            <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- Add your site or application content here -->
        <p id="testP">Hello world! This is HTML5 Boilerplate.</p>

        <script>
        	/*说明:javascript中有5种简单类型(也成为基本数据类型):Undefined,Null,Boolean,Number和String,还有一种复杂数据类型--Object,Object本质上是由一组无序的名值对组成的。
        	javascript中包含9个原生对象构造函数,Number(),String(),Boolean(),Object(),Array(),Function(),Date(),RegExp(),Error()
        	1.typeof
        	用来检测给定变量的数据类型,有以下类型
        	"undefined":如果这个值未定义
        	"boolean":如果这个值是布尔值
        	"string":如果这个值是字符串
        	"number":如果这个值是数值
        	"object":如果这个值是对象或null
        	"function":如果这个值是函数	

        	2.instanceof
        	要求左边的运算数是一个对象,右边的运算数是对象类的名字。如果运算符左边的对象是右边类的一个实例,它返回true,否则返回false			
			*/	

			//var undefined = undefined;
			var obj ={};
			console.log("undefined:",typeof b);//未定义变量 undefined
			console.log("undefined:",typeof obj.name == 'undefined');//未定义属性

			

			var bVal = false;
			var bVal2 = new Boolean(false);
			var bVal3 = Boolean(false);
			console.log("Boolean:",typeof bVal == 'boolean');
			console.log("Boolean:",typeof bVal2);
			console.log("Boolean:",typeof bVal3);

			var strVal = "a";
			var strVal2 = new String("a");
			var strVal3 = String("a");
			console.log("String:",typeof strVal == 'string');
			console.log("String:",typeof strVal2);
			console.log("String:",typeof strVal3);

			var numVal = 10;
			var numVal2 = 10;
			var numVal3 = 10;
			console.log("Number:",typeof numVal =='number');


			console.log("Null:",typeof null);

			var objVal = {};
			console.log("Object:",typeof objVal == 'object');

			var array = [];
			console.log("Object:",typeof array =='object');

			var fun = function (argument) {
				console.log("fun");
			}

			console.log("Function:",typeof fun =='function');

			function Person(){

			}

			var person = new Person();
			console.log("Function:",typeof Person =='function');
			console.log("Object:",typeof person =='object');

			console.log("Array:",array instanceof Array);
			//判断是数组类型
			console.log("Array:",(Object.prototype.toString.call(array) === '[object Array]'));

  			(function(){
  				var ObjectProto = Object.prototype;
				var isArguments=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Arguments]"?true:false;
				};
				var isFunction=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Function]"?true:false;
				};
				var isString=function (obj) {
					return ObjectProto.toString.call(obj)=="[object String]"?true:false;
				};
				var isNumber=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Number]"?true:false;
				};
				var isArray=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Array]"?true:false;
				};
				var isDate=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Date]"?true:false;
				};
				var isRegExp=function (obj) {
					return ObjectProto.toString.call(obj)=="[object RegExp]"?true:false;
				};
				var isBoolean=function (obj) {
					return ObjectProto.toString.call(obj)=="[object Boolean]"?true:false;
				};
				var isNull = function(obj) {
	    			return obj === null?true:false;
	  			};
	  			var isUndefined = function(obj) {
	    			return obj === void 0?true:false;
	  			};
	  			var isNaN = function(obj) {
	    			return isNumber(obj) && obj !== +obj;
	  			};
	  			var isObject = function(obj) {
	    			var type = typeof obj;
	    			return type === 'function' || type === 'object' && !!obj;
	  			};
	  			var isElement = function(obj) {
	    			return !!(obj && obj.nodeType === 1);
	  			};
	  			var has = function(obj, key) {
	    			return obj != null && ObjectProto.hasOwnProperty.call(obj, key);
	  			};
	  			var isEmpty = function(obj) {
	    			if (obj == null){
	    				return true;	
	    			} 
	    			if (isArray(obj) || isString(obj) || isArguments(obj)){
	    				return obj.length === 0;
	    			}
	    			for (var key in obj){
	    				if (has(obj, key)){
	    					return false;	
	    				} 
	    			} 
	    			return true;
	  			};
	  			var nativeKeys = Object.keys;
	  			var keys = function(obj) {
	    			if (!isObject(obj)){
	    				return [];
	    			} 
	    			if (nativeKeys){
	    				return nativeKeys(obj);	
	    			} 
	    			var keys = [];
	    			for (var key in obj) {
	    				if (has(obj, key)){
	    					keys.push(key);
	    				} 
	    			}
	    			return keys;
	  			};

	  			var values = function(obj) {
	    			var keysArr = keys(obj);
	    			var length = keysArr.length;
	    			var values = Array(length);
	    			for (var i = 0; i < length; i++) {
	      				values[i] = obj[keysArr[i]];
	    			}
	    			return values;
	  			};
	  			//Convert an object into a list of `[key, value]` pairs
	  		    var pairs = function(obj) {
	    			var keysArr = keys(obj);
	    			var length = keysArr.length;
	    			var pairs = Array(length);
	    			for (var i = 0; i < length; i++) {
	      				pairs[i] = [keysArr[i], obj[keysArr[i]]];
	    			}
	    			return pairs;
	  			};
  				console.log("-----------------以下是分割线------------------");
  				console.log("-----------------调用方法------------------");
  				console.log("isArguments",isArguments(arguments));
  				function testFunction(){

  				};
  				var testString = "mike",testInt=123,testArr=['mike','is','me'],testDate=new Date(),
  					testReg=/^abc/,testBoolean=true,testNull=null,testUndefined,testNaN=NaN,testObj={id:789,name:'mike',gender:'male'},
  					testElement=document.getElementById('testP');
  				console.log("isFunction",isFunction(testString),isFunction(testFunction));
  				console.log("isString",isString(testString),isString(testInt));
  				console.log("isNumber",isNumber(testInt),isNumber(testString));
  				console.log("isArray",isArray(testArr),isArray(testInt));
  				console.log("isDate",isDate(testDate));
  				console.log("isRegExp",isRegExp(testReg));
  				console.log("isBoolean",isBoolean(testBoolean));
  				console.log("isNull",isNull(testNull));
  				console.log("isUndefined",isUndefined(testUndefined));
  				console.log("isNaN",isNaN(testNaN));
  				console.log("isObject",isObject(testObj));
  				console.log("isElement",isElement(testElement));
  				console.log("keys",keys(testObj));
  				console.log("values",values(testObj));
  				console.log("pairs",pairs(testObj));
  			})();
  			/*	浏览器控制台日志:
  				typeofAndInstanceOf.html:41 undefined: undefined
				typeofAndInstanceOf.html:42 undefined: true
				typeofAndInstanceOf.html:49 Boolean: true
				typeofAndInstanceOf.html:50 Boolean: object
				typeofAndInstanceOf.html:51 Boolean: boolean
				typeofAndInstanceOf.html:56 String: true
				typeofAndInstanceOf.html:57 String: object
				typeofAndInstanceOf.html:58 String: string
				typeofAndInstanceOf.html:63 Number: true
				typeofAndInstanceOf.html:66 Null: object
				typeofAndInstanceOf.html:69 Object: true
				typeofAndInstanceOf.html:72 Object: true
				typeofAndInstanceOf.html:78 Function: true
				typeofAndInstanceOf.html:85 Function: true
				typeofAndInstanceOf.html:86 Object: true
				typeofAndInstanceOf.html:88 Array: true
				typeofAndInstanceOf.html:90 Array: true
				typeofAndInstanceOf.html:188 -----------------以下是分割线------------------
				typeofAndInstanceOf.html:189 -----------------调用方法------------------
				typeofAndInstanceOf.html:190 isArguments true
				typeofAndInstanceOf.html:197 isFunction false true
				typeofAndInstanceOf.html:198 isString true false
				typeofAndInstanceOf.html:199 isNumber true false
				typeofAndInstanceOf.html:200 isArray true false
				typeofAndInstanceOf.html:201 isDate true
				typeofAndInstanceOf.html:202 isRegExp true
				typeofAndInstanceOf.html:203 isBoolean true
				typeofAndInstanceOf.html:204 isNull true
				typeofAndInstanceOf.html:205 isUndefined true
				typeofAndInstanceOf.html:206 isNaN true
				typeofAndInstanceOf.html:207 isObject true
				typeofAndInstanceOf.html:208 isElement true
				typeofAndInstanceOf.html:209 keys ["id", "name", "gender"]
				typeofAndInstanceOf.html:210 values [789, "mike", "male"]
				typeofAndInstanceOf.html:211 pairs [Array[2], Array[2], Array[2]]0: Array[2]0: "id"1: 789length: 2__proto__: Array[0]1: Array[2]2: Array[2]length: 3__proto__: Array[0]
			*/
        </script>
    </body>
</html>

 

javascript中的类型判断

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
  最近在翻看John Resig的大作《Pro JavaScript Techniques》,里面讲到了如何做javascript的类型
JavaScript的类型转换 By 大志若愚 (一)转换为字符串   X + ''   toString()   String()  
IT程序员开发必备-各类资源下载清单,史上最全IT资源,个人收藏总结!
前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种?”。 有的回答“数字、字符串、布
前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种?”。 有的回答“数字、字符串、布
前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种?”。 有的回答“数字、字符串、布
前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种?”。 有的回答“数字、字符串、布
前端面试中常被问到的问题之一就是“JavaScript的基本类型有几种?”。 有的回答“数字、字符串、布
一、核心JavaScript内置对象,即ECMAScript实现提供的不依赖于宿主环境的对象   这些对象在程序执
javascript中检测对象的类型的运算符有:typeof、constructor、instanceof。 typeof:typeof是一个
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号