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

作者:半夏时间:2026-10-23 21:46:55浏览:131

本文详细对比了JavaScript中判断数据类型的四种常用方法:typeof运算符、instanceof运算符、constructor属性以及Object.prototype.toString方法。通过控制台测试输出,分析了各方法对基本数据类型、对象类型及特殊值(如null、undefined)的返回结果,指出Object.prototype.toString是目前最完善的判断方式。

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

本文介绍了JavaScript中用于判断数据类型的四种主要方法,并记录了它们之间的具体差异。这四种方法分别是:typeof运算符、instanceof运算符、constructor属性以及Object.prototype.toString方法。

使用 typeof 判断数据类型

一、使用 typeof 判断数据类型


console.log('测试 Number ->', typeof 1); // number
console.log('测试 Boolean ->', typeof true); // boolean
console.log('测试 String ->', typeof ''); // string
console.log('测试 null ->', typeof null); // object
console.log('测试 undefined ->', typeof undefined); // undefined
console.log('测试 NaN ->', typeof NaN); // number
console.log('测试 function ->', typeof function () { }); // function
console.log('测试 Object ->', typeof {}); // object
console.log('测试 Array ->', typeof []); // object
console.log('测试 Date ->', typeof new Date()); // object
console.log('测试 Error ->', typeof new Error()); // object
console.log('测试 RegExp ->', typeof new RegExp()); // object
console.log('测试 Symbol ->', typeof Symbol()); // symbol
console.log('测试 Map ->', typeof new Map()); // object
console.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 判断数据类型

二、使用 instanceof 判断数据类型


console.log('测试 Number ->', 1 instanceof Number); // false
console.log('测试 Boolean ->', true instanceof Boolean); // false
console.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 undefined
console.log('测试 NaN ->', NaN instanceof Number); // false
console.log('测试 function ->', function () { } instanceof Function); // true
console.log('测试 Object ->', {} instanceof Object); // true
console.log('测试 Array ->', [] instanceof Array); // true
console.log('测试 Date ->', new Date() instanceof Date); // true
console.log('测试 Error ->', new Error() instanceof Error); // true
console.log('测试 RegExp ->', new RegExp() instanceof RegExp); // true
console.log('测试 Symbol ->', Symbol() instanceof Symbol); // false
console.log('测试 Map ->', new Map() instanceof Map); // true
console.log('测试 Set ->', new Set() instanceof Set); // true

console.log('测试 new Number ->', new Number(1) instanceof Number); // true
console.log('测试 new Boolean ->', new Boolean(true) instanceof Boolean); // true
console.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 判断数据类型

三、使用 constructor 判断数据类型


console.log('测试 Number ->', (1).constructor === Number); // true
console.log('测试 Boolean ->', true.constructor === Boolean); // true
console.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 undefined
console.log('测试 NaN ->', NaN.constructor === Number); // true 注意:NaN和infinity一样是Number类型的一个特殊值
console.log('测试 function ->', function () { }.constructor === Function); // true
console.log('测试 Object ->', {}.constructor === Object); // true
console.log('测试 Array ->', [].constructor === Array); // true
console.log('测试 Date ->', new Date().constructor === Date); // true
console.log('测试 Error ->', new Error().constructor === Error); // true
console.log('测试 RegExp ->', new RegExp().constructor === RegExp); // true
console.log('测试 Symbol ->', Symbol().constructor === Symbol); // true
console.log('测试 Map ->', new Map().constructor === Map); // true
console.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 判断数据类型

四、使用 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判断数据类型的资料请关注本站其它相关文章!

作者最新文章