JavaScript中对数据类型检测的方法总结-tutorial js-php.cn

JavaScript中对数据类型检测的方法总结

韦小宝

Lepaskan： 2018-03-14 18:30:35

asal

1184 orang telah melayarinya

本篇文章讲述了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 = &#39;123&#39;;
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

Salin selepas log masuk

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

typeof 方法函数封装

function typeOf(obj){
    return (obj === &#39;null&#39;) ? &#39;null&#39; : (typeof obj)
}

Salin selepas log masuk

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

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

Salin selepas log masuk

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(&#39;123&#39;);
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

Salin selepas log masuk

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

3.constructor属性

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

返回值类型：对象Object

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

各个类型检验方法如下：

         /*5大基本类型*/

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

var a = &#39;123&#39;;
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(&#39;abc&#39;);
console.log(a.constructor == RegExp);   //true
var a = /^abc$/;
console.log(a.constructor == RegExp);   //true

Salin selepas log masuk

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 = &#39;123&#39;;
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(&#39;abc&#39;);
console.log(toStringType(a));       //"RegExp"
var a = /^abc$/;
console.log(toStringType(a));       //"RegExp"

Salin selepas log masuk

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

代码如下：

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

Salin selepas log masuk

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

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

Salin selepas log masuk

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

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

3.slice的作用？

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

Salin selepas log masuk

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

以上就是本篇文章的所有内容，大家要是还不太了解的话，可以自己多实现两边就很容易掌握了哦！

相关推荐：

PHP数据类型检测实例详解

JavaScript中数据类型检测方法的总结

Atas ialah kandungan terperinci JavaScript中对数据类型检测的方法总结. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!