JavaScript 判断数据类型的4种方法

本文提供四种方法判断js数据类型，这里记录了它们之间的差异，分别是 typeof 运算符、instanceof 运算符、constructor 属性、Object.prototype.toString 方法。

一、使用 typeof 判断数据类型

console.log(\'测试 Number ->\', typeof 1); // numberconsole.log(\'测试 Boolean ->\', typeof true); // booleanconsole.log(\'测试 String ->\', typeof \'\'); // stringconsole.log(\'测试 null ->\', typeof null); // objectconsole.log(\'测试 undefined ->\', typeof undefined); // undefinedconsole.log(\'测试 NaN ->\', typeof NaN); // numberconsole.log(\'测试 function ->\', typeof function () { }); // functionconsole.log(\'测试 Object ->\', typeof {}); // objectconsole.log(\'测试 Array ->\', typeof []); // objectconsole.log(\'测试 Date ->\', typeof new Date()); // objectconsole.log(\'测试 Error ->\', typeof new Error()); // objectconsole.log(\'测试 RegExp ->\', typeof new RegExp()); // objectconsole.log(\'测试 Symbol ->\', typeof Symbol()); // symbolconsole.log(\'测试 Map ->\', typeof new Map()); // objectconsole.log(\'测试 Set ->\', typeof new Set()); // object

控制台输出如下：

测试 Number -> number
测试 Boolean -> boolean
测试 String -> string
测试 null -> object
测试 undefined -> undefined
测试 NaN -> number
测试 function -> function
测试 Object -> object
测试 Array -> object
测试 Date -> object
测试 Error -> object
测试 RegExp -> object
测试 Symbol -> symbol
测试 Map -> object
测试 Set -> object

总结：

1、typeof只能判断:

• String(返回string),
• Number(返回number),
• Boolean(返回boolean),
• undefined(返回undefined),
• function(返回function),
• Symbol(返回symbol)

2、对于new构造出来的都是返回object

3、对于Object和Array都是返回object

二、使用 instanceof 判断数据类型

console.log(\'测试 Number ->\', 1 instanceof Number); // falseconsole.log(\'测试 Boolean ->\', true instanceof Boolean); // falseconsole.log(\'测试 String ->\', \'\' instanceof String); // false// console.log(\'测试 null ->\', null instanceof null); // TypeError: Cannot read property \'constructor\' of null// console.log(\'测试 undefined ->\', undefined instanceof undefined); // TypeError: Cannot read property \'constructor\' of undefinedconsole.log(\'测试 NaN ->\', NaN instanceof Number); // falseconsole.log(\'测试 function ->\', function () { } instanceof Function); // trueconsole.log(\'测试 Object ->\', {} instanceof Object); // trueconsole.log(\'测试 Array ->\', [] instanceof Array); // trueconsole.log(\'测试 Date ->\', new Date() instanceof Date); // trueconsole.log(\'测试 Error ->\', new Error() instanceof Error); // trueconsole.log(\'测试 RegExp ->\', new RegExp() instanceof RegExp); // trueconsole.log(\'测试 Symbol ->\', Symbol() instanceof Symbol); // falseconsole.log(\'测试 Map ->\', new Map() instanceof Map); // trueconsole.log(\'测试 Set ->\', new Set() instanceof Set); // trueconsole.log(\'测试 new Number ->\', new Number(1) instanceof Number); // trueconsole.log(\'测试 new Boolean ->\', new Boolean(true) instanceof Boolean); // trueconsole.log(\'测试 new String ->\', new String(\'\') instanceof String); // true

控制台输出如下：

测试 Number -> false
测试 Boolean -> false
测试 String -> false
测试 NaN -> false
测试 function -> true
测试 Object -> true
测试 Array -> true
测试 Date -> true
测试 Error -> true
测试 RegExp -> true
测试 Symbol -> false
测试 Map -> true
测试 Set -> true
测试 new Number -> true
测试 new Boolean -> true
测试 new String -> true

总结：

1、不能判断 null,undefined

2、基本数据类型 Number,String,Boolean 不能被判断

3、instanceof 用来判断对象是否为某一数据类型的实例，
上例中1,true,\’\’不是实例，所以判断为false

三、使用 constructor 判断数据类型

console.log(\'测试 Number ->\', (1).constructor === Number); // trueconsole.log(\'测试 Boolean ->\', true.constructor === Boolean); // trueconsole.log(\'测试 String ->\', \'\'.constructor === String); // true// console.log(\'测试 null ->\', null.constructor === null); // TypeError: Cannot read property \'constructor\' of null// console.log(\'测试 undefined ->\', undefined.constructor); // TypeError: Cannot read property \'constructor\' of undefinedconsole.log(\'测试 NaN ->\', NaN.constructor === Number); // true 注意:NaN和infinity一样是Number类型的一个特殊值console.log(\'测试 function ->\', function () { }.constructor === Function); // trueconsole.log(\'测试 Object ->\', {}.constructor === Object); // trueconsole.log(\'测试 Array ->\', [].constructor === Array); // trueconsole.log(\'测试 Date ->\', new Date().constructor === Date); // trueconsole.log(\'测试 Error ->\', new Error().constructor === Error); // trueconsole.log(\'测试 RegExp ->\', new RegExp().constructor === RegExp); // trueconsole.log(\'测试 Symbol ->\', Symbol().constructor === Symbol); // trueconsole.log(\'测试 Map ->\', new Map().constructor === Map); // trueconsole.log(\'测试 Set ->\', new Set().constructor === Set); // true

控制台输出如下：

测试 Number -> true
测试 Boolean -> true
测试 String -> true
测试 NaN -> true
测试 function -> true
测试 Object -> true
测试 Array -> true
测试 Date -> true
测试 Error -> true
测试 RegExp -> true
测试 Symbol -> true
测试 Map -> true
测试 Set -> true

总结：

不能判断null,undefined,其它的都可以

四、使用 Object.prototype.toString 判断数据类型

console.log(\'测试 Number ->\', Object.prototype.toString.call(1)); // [object Number]console.log(\'测试 Boolean ->\', Object.prototype.toString.call(true)); // [object Boolean]console.log(\'测试 String ->\', Object.prototype.toString.call(\'\')); // [object String]console.log(\'测试 null ->\', Object.prototype.toString.call(null)); // [object Null]console.log(\'测试 undefined ->\', Object.prototype.toString.call(undefined)); // [object Undefined]console.log(\'测试 NaN ->\', Object.prototype.toString.call(NaN)); // [object Number]console.log(\'测试 function ->\', Object.prototype.toString.call(function () { })); // [object Function]console.log(\'测试 Object ->\', Object.prototype.toString.call({})); // [object Object]console.log(\'测试 Array ->\', Object.prototype.toString.call([])); // [object Array]console.log(\'测试 Date ->\', Object.prototype.toString.call(new Date())); // [object Date]console.log(\'测试 Error ->\', Object.prototype.toString.call(new Error())); // [object Error]console.log(\'测试 RegExp ->\', Object.prototype.toString.call(new RegExp())); // [object RegExp]console.log(\'测试 Symbol ->\', Object.prototype.toString.call(Symbol())); // [object Symbol]console.log(\'测试 Map ->\', Object.prototype.toString.call(new Map())); // [object Map]console.log(\'测试 Set ->\', Object.prototype.toString.call(new Set())); // [object Set]

控制台输出如下：

测试 Number -> [object Number]
测试 Boolean -> [object Boolean]
测试 String -> [object String]
测试 null -> [object Null]
测试 undefined -> [object Undefined]
测试 NaN -> [object Number]
测试 function -> [object Function]
测试 Object -> [object Object]
测试 Array -> [object Array]
测试 Date -> [object Date]
测试 Error -> [object Error]
测试 RegExp -> [object RegExp]
测试 Symbol -> [object Symbol]
测试 Map -> [object Map]
测试 Set -> [object Set]

总结：

目前最完美的判断数据类型的方法

结语：以上为笔者的测试和总结。如有误或不完整地方，欢迎各位老铁指正。

以上就是JavaScript 判断数据类型的4种方法的详细内容，更多关于JavaScript判断数据类型的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

• JavaScript事件循环及宏任务微任务原理解析
• JS事件循环机制event loop宏任务微任务原理解析
• JavaScript常用工具函数库汇总
• 关于JavaScript数组去重的一些理解汇总
• 谈谈JavaScript中的函数
• 浅析JavaScript 函数柯里化
• JavaScript 事件代理需要注意的地方
• 浅谈javascript事件环微任务和宏任务队列原理