JavaScript判断数据类型有几种方法,以及它们的区别

JavaScript判断数据类型有几种方法,以及它们的区别

JavaScript有五种数据判断类型方法:

typeofinstanceofconstructorObject.prototype.toString.call()jquery.type()

一、typeof方法:

1、可以判断数据类型,它返回表示数据类型的字符串(返回结果只能包括number,boolean,string,function,object,undefined);

2、可以使用typeof判断变量是否存在(如if(typeof a!=“undefined”){…});

3、Typeof 运算符的问题是无论引用的对象是什么类型 它都返回object

例如:

console.log(

typeof 100, //"number"

typeof 'abc', //"string"

typeof false, //"boolean"

typeof undefined, //"undefined"

typeof null, //"object"

typeof [1,2,3], //"object"

typeof {a:1,b:2,c:3}, //"object"

typeof function(){console.log('aaa');}, //"function"

typeof new Date(), //"object"

typeof /^[a-zA-Z]{5,20}$/, //"object"

typeof new Error() //"object"

typeof new Number(100), //'object'

typeof new String('abc'),// 'string'

typeof new Boolean(true),//'boolean'

)

二、instanceof方法:

一般用来检测引用数据类型,表达式为:A instanceof B,判断A是否是B的实例,如果 A 是 B 的实例,则返回 true,否则返回 false,由构造类型判断出数据类型

例如:

console.log(

100 instanceof Number, //false

'dsfsf' instanceof String, //false

false instanceof Boolean, //false

undefined instanceof Object, //false

null instanceof Object, //false

[1,2,3] instanceof Array, //true

{a:1,b:2,c:3} instanceof Object, //true

function(){console.log('aaa');} instanceof Function, //true

new Date() instanceof Date, //true

/^[a-zA-Z]{5,20}$/ instanceof RegExp, //true

new Error() instanceof Error //true

)

//注意: instanceof 后面一定要是对象类型,大小写不能写错,该方法试用一些条件选择或分支

还需要注意null和undefined都返回了false,这是因为它们的类型就是自己本身,并不是Object创建出来它们,所以返回了false。

三、constructor方法:

constructor是prototype对象上的属性,指向构造函数,

例如:

var num = 123;

var str = 'abcdef';

var bool = true;

var arr = [1, 2, 3, 4];

var json = {name:'wenzi', age:25};

var func = function(){ console.log('this is function'); }

var und = undefined;

var nul = null;

var date = new Date();

var reg = /^[a-zA-Z]{5,20}$/;

var error= new Error();

function Person(){

}

var tom = new Person();

// undefined和null没有constructor属性

console.log(

tom.constructor==Person,

num.constructor==Number,

str.constructor==String,

bool.constructor==Boolean,

arr.constructor==Array,

json.constructor==Object,

func.constructor==Function,

date.constructor==Date,

reg.constructor==RegExp,

error.constructor==Error

);

//所有结果均为true

注意:除了undefined和null之外,其他类型都可以通过constructor属性来判断类型

四、Object.prototype.toString 方法:

用来检测对象类型

例如:

var toString = Object.prototype.toString;

toString.call(123); //"[object Number]"

toString.call('abcdef'); //"[object String]"

toString.call(true); //"[object Boolean]"

toString.call([1, 2, 3, 4]); //"[object Array]"

toString.call({name:'wenzi', age:25}); //"[object Object]"

toString.call(function(){ console.log('this is function'); }); //"[object Function]"

toString.call(undefined); //"[object Undefined]"

toString.call(null); //"[object Null]"

toString.call(new Date()); //"[object Date]"

toString.call(/^[a-zA-Z]{5,20}$/); //"[object RegExp]"

toString.call(new Error()); //"[object Error]"

所有数据类型的父类都是Object, toString为Object的原型prototype的方法,返回格式为[object xxx],其中Object对象返回的是[Object object],其他类型需通过call/apply来调用

Object.prototype.tostring.call();

使用Object.prototype.toString.call()的方式来判断一个变量的类型是最准确的方法。

五、无敌万能的方法:jquery.type()

如果对象是undefined或null,则返回相应的“undefined”或“null”。

jQuery.type( undefined ) === "undefined"

jQuery.type() === "undefined"

jQuery.type( window.notDefined ) === "undefined"

jQuery.type( null ) === "null"

如果对象有一个内部的[[Class]]和一个浏览器的内置对象的 [[Class]] 相同,我们返回相应的 [[Class]] 名字

jQuery.type( true ) === "boolean"

jQuery.type( 3 ) === "number"

jQuery.type( "test" ) === "string"

jQuery.type( function(){} ) === "function"

jQuery.type( [] ) === "array"

jQuery.type( new Date() ) === "date"

jQuery.type( new Error() ) === "error" // as of jQuery 1.9

jQuery.type( /test/ ) === "regexp"

其他一切都将返回它的类型“object”。

自己也可以封装一个获取变量准确类型的函数

function gettype(obj) {

var type = typeof obj;

if (type !== 'object') {

return type;

}

//如果不是object类型的数据,直接用typeof就能判断出来

//如果是object类型数据,准确判断类型必须使用Object.prototype.toString.call(obj)的方式才能判断

return Object.prototype.toString.call(obj).replace(/^\[object (\S+)\]$/, '$1');

}

相关画作

日本十大步兵 骑兵有马(码)/步兵无马(码)
365bet体育注册开户

日本十大步兵 骑兵有马(码)/步兵无马(码)

📅 08-22 👁️ 9042
oppo手机怎么杀毒软件
365彩票最专业的

oppo手机怎么杀毒软件

📅 09-03 👁️ 3254
信用卡如何給支付寶充值?一文搞懂詳細操作步驟
365bet体育注册开户

信用卡如何給支付寶充值?一文搞懂詳細操作步驟

📅 07-05 👁️ 4071