javascript数据类型判断 js判断数据类型

转载

mob64ca13f83523 2023-09-20 13:40:13

文章标签 javascript数据类型判断 javascript 前端 Boo 数据类型 文章分类 JavaScript 前端开发

基本数据类型有哪些

常见的判断js数据类型的方法有如下几种

一.typeof

二.instance of

三. 使用constructor判断数据类型

四.对象原型链判断方法:Object.prototype.toString.call()

基本数据类型有哪些

1. number， string, boolean, null,undefined，symbol以及未来ES10新增的BiglInt(任意精度整
数)七类。
2. 引用数据类型(Object类)有常规名值对的无序对象{a:1]，数组[1,2.3]，以及函数等。

常见的判断js数据类型的方法有如下几种

1. 最常见的判断方法: typeof
2. 已知对象类型: instanceof
3. 对象原型链判断方法: prototype通用但很繁琐
4. 根据对象的构造器constructor进行判断
5. j Query方法: jquery.type()
6. 严格运算符:===
下面依次说下每个方法的写法跟结果

一.typeof

其中typeof返回的类型都是字符串形式，需注意用于判断数据类型，返回值为6个字符串，分别为string、boolean、number、function、object、undefined

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

总结

1、typeof只能判断:

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

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

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

4. 判断NaN isNaN(any)直接调用此方法判断是否为非数值

这使得在判断这些数据类型的时候，得不到真实的数据类型。由此引出instanceof。

二.instance of

注意: 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

总结：

1、不能判断 null,undefined

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

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

三. 使用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

总结：

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

四.对象原型链判断方法:Object.prototype.toString.call()

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]

那为什么不直接用obj.toString()呢?

console.log("jerry".toString());//jerry
console.log((1).toString());//1
console.log([1,2].toString());//1,2
console.log(new Date().toString());//Wed Dec 21 2016 20:35:48 GMT+0800 (中国标准时间)
console.log(function(){}.toString());//function (){}
console.log(null.toString());//error
console.log(undefined.toString());//error

这是因为toString为Object的原型方法，而Array 、Function等类型作为Object的实例，都重写了toString方法。不同的对象类型调用toString方法时，根据原型链的知识，调用的是对应的重写之后的toString方法（Function类型返回内容为函数体的字符串，Array类型返回元素组成的字符串.....），而不会去调用Object上原型toString方法（返回对象的具体类型），所以采用obj.toString()不能得到其对象类型，只能将obj转换为字符串类型；因此，在想要得到对象的具体类型时，应该调用Object上原型toString方法。

我们可以验证一下，将数组的toString方法删除，看看会是什么结果：

var arr=[1,2,3];
console.log(Array.prototype.hasOwnProperty("toString"));//true
console.log(arr.toString());//1,2,3
delete Array.prototype.toString;//delete操作符可以删除实例属性
console.log(Array.prototype.hasOwnProperty("toString"));//false
console.log(arr.toString());//"[object Array]"

删除了Array的toString方法后，同样再采用arr.toString()方法调用时，不再有屏蔽Object原型方法的实例方法，因此沿着原型链，arr最后调用了Object的toString方法，返回了和Object.prototype.toString.call(arr)相同的结果。

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。