视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
JavaScript中对数据类型检测的方法总结
2020-11-27 19:59:51 责编:小采
文档


本篇文章讲述了JavaScript中对数据类型检测的方法,大家对JavaScript中对数据类型检测的方法不了解的话或者对JavaScript中对数据类型检测的方法感兴趣的话那么我们就一起来看看本篇文章吧, 好了废话少说进入正题吧!

在这之前,先说说js的类型,js有5大基本类型和一个复杂类型
5大基本类型:undefined,null,number,string,bollean
一个复杂类型:object

1.typeof

返回值类型:字符串

检测如下:

 /*5大基本类型*/

var a = 123;
console.log(typeof a == "number"); //true

var a = '123';
console.log(typeof a == "string"); //true

var a = true;
console.log(typeof a == "boolean"); //true

var a = undefined;
console.log(typeof a == "undefined"); //true

var a = null;
console.log(a == null); //true

 /*复杂类型*/

var a = function(){};
console.log(typeof a == "function"); //true

对于其他引用类型的对象,typeof不能检测区分,都会返回Object,如日期类型,正则表达式类型等,因此我们不能区分到底检测的是什么(用下文其他方法检测)

typeof 方法函数封装

function typeOf(obj){
 return (obj === 'null') ? 'null' : (typeof obj)
}

在这最后,补充一个特殊的NaN

console.log(typeof NaN === "number"); //true

2.instanceof

instanceof 运算符可以用来检测一个对象是不是另一个对象的实例

语法:object1 instanceof object2
参数:object1-一个对象,constructor-另一个对象

返回值类型: 布尔值Boolean

怎样理解上面抽象的话呢?

也就是说,通过实例对象的原型链可以访问构造函数对象的原型对象上,这也就是instanceof的工作原理,这也说明了,instanceof并不关心对象的本身结构,只是关心对象与构造函数的关系。

var a = new Date();
console.log(a instanceof Date); //true
console.log(a instanceof Object); //true

var a = new RegExp('123');
console.log(a instanceof RegExp); //true
console.log(a instanceof Object); //true

var a = function(){};
console.log(a instanceof Function); //true
console.log(a instanceof Object); //true

var a = [];
console.log(a instanceof Array); //true
console.log(a instanceof Object); //true

var a = {};
console.log(a instanceof Object); //true

这里我列出了比较常用的实例,如果大家真的对instanceof比较关心的话,点击这里MDN文档

3.constructor属性

constructor 属性返回对创建此对象的构造函数的引用。

返回值类型: 对象Object

这里说明一点的是,我们平时创建的,如: var a = 1, var b = ‘123’…,其实都是引用他们相对应的构造函数从而创建出来他们对于的类型,而不是表面我们看到的直接创建。

各个类型检验方法如下:

 /*5大基本类型*/

var a = 123;
console.log(a.constructor == Number); //true

var a = '123';
console.log(a.constructor == String); //true

var a = true;
console.log(a.constructor == Boolean); //true

var a = undefined;
console.log(a && a.constructor); //undefined

var a = null;
console.log(a && a.constructor); //null

 /*复杂类型*/

var a = function(){};
console.log(a.constructor == Function); //true

var a = new Date();
console.log(a.constructor == Date); //true

var a = new Object();
console.log(a.constructor == Object); //true
var a = {};
console.log(a.constructor == Object); //true

var a = new Array();
console.log(a.constructor == Array); //true
var a = [];
console.log(a.constructor == Array); //true

var a = new RegExp('abc');
console.log(a.constructor == RegExp); //true
var a = /^abc$/;
console.log(a.constructor == RegExp); //true

4.toString()方法

这个方法检测对象类型最安全,最准确的方法。

返回值类型:字符串String

/*toString 检测类型函数*/
function toStringType(obj){
 return Object.prototype.toString.call(obj).slice(8, -1);
}
 /*5大基本类型*/

var a = 123;
console.log(toStringType(a)); //"Number"

var a = '123';
console.log(toStringType(a)); //"String"

var a = true;
console.log(toStringType(a)); //"Boolean"

var a = undefined;
console.log(toStringType(a)); //"Undefined"

var a = null;
console.log(toStringType(a)); //"Null"

 /*复杂类型*/

var a = function(){};
console.log(toStringType(a)); //"Function"

var a = new Date();
console.log(toStringType(a)); //"Date"

var a = new Object();
console.log(toStringType(a)); //"Object"
var a = {};
console.log(toStringType(a)); //"Object"

var a = new Array();
console.log(toStringType(a)); //"Array"
var a = [];
console.log(toStringType(a)); //"Array"

var a = new RegExp('abc');
console.log(toStringType(a)); //"RegExp"
var a = /^abc$/;
console.log(toStringType(a)); //"RegExp"

如果你觉得返回的字符串大小写比较麻烦的话,你可以全部转化成小写

代码如下:

function toStringType(obj){
 return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}

到现这个地方,大家可能有疑惑。

var a = 123;
console.log(a.toString()); //"123"

1.为什么这样写,返回的是“123”?
答:因为js中每个对象都预定义有自己的toString方法,类似于重写了toString

2.文章中为什么要用call方法?作用是什么?
答:call作用是改变作用域为当前作用域,以文章为例,即将Object的作用域执行环境变为a的,

3.slice的作用?

var a = 123;
console.log(Object.prototype.toString.call(a)); //"[Object Number]"

通过这个例子,相比你即明白了吧,是为了结果的直观性。

下载本文
显示全文
专题