搜索
您的当前位置:首页正文

js判断各种数据类型的简单方法

2023-12-01 来源:字库网

了解js的都知道, 有个typeof 用来判断各种数据类型,有两种写法:typeof xxx ,typeof(xxx)

如下实例:

typeof 2 输出 number

typeof null 输出 object

typeof {} 输出 object

typeof [] 输出 object

typeof (function(){}) 输出 function

typeof undefined 输出 undefined

typeof '222' 输出 string

typeof true 输出 boolean

这里面包含了js里面的五种数据类型 number string boolean undefinedobject和函数类型 function

看到这里你肯定会问了:我怎么去区分对象,数组和null呢?

接下来我们就用到另外一个利器:Object.prototype.toString.call

这是对象的一个原生原型扩展函数,用来更精确的区分数据类型。

我们来试试这个玩儿意儿:

var gettype=Object.prototype.toString

gettype.call('aaaa')输出 [object String]

gettype.call(2222) 输出 [object Number]

gettype.call(true) 输出 [object Boolean]

gettype.call(undefined) 输出 [object Undefined]

gettype.call(null) 输出 [object Null]

gettype.call({}) 输出 [object Object]

gettype.call([]) 输出 [object Array]

gettype.call(function(){}) 输出 [object Function]

看到这里,刚才的问题我们解决了。

其实js 里面还有好多类型判断

[object HTMLDivElement] div 对象 , [object HTMLBodyElement] body 对象,[object Document](IE)或者 [object HTMLDocument](firefox,google) ......

各种dom节点的判断,这些东西在我们写插件的时候都会用到。

可以封装的方法如下:

var gettype=Object.prototype.toString var utility={ isObj:function(o){ return gettype.call(o)=="[object Object]"; }, isArray:function(o){ return gettype.call(o)=="[object Array]"; }, isNULL:function(o){ return gettype.call(o)=="[object Null]"; }, isDocument:function(){ return gettype.call(o)=="[object Document]"|| [object HTMLDocument]; } ........ }

以上这篇js 判断各种数据类型的简单方法(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持PHP中文网。

更多js 判断各种数据类型的简单方法相关文章请关注PHP中文网!

小编还为您整理了以下内容,可能对您也有帮助:

详解在javaScript中检测数据类型的几种方式总结

在用javaScript编程的过程中,我们经常会遇到这样一个问题,就是需要检测一个数据或变量的类型,本篇文章主要介绍了在javaScript中检测数据类型的几种方式小结,有兴趣的可以了解一下。

在用javaScript编程的过程中,我们经常会遇到这样一个问题,就是需要检测一个数据或变量的类型,那么在javaScript中给我们提供了哪些方法呢?网上流传的代码比比皆是,但是发现其中有些是有误的,索性我自己动手把每种方法用了一遍,今天我专门整理了下,以便以后查阅。

一、typeof 检测

typeof 是一个一元运算符,语法:typeof(运算数),运算数可以是任意类型。它的返回值是一个字符串,该字符串说明运算数的类型。

二、instanceof 检测

instanceof 检测某个对象是不是另一个对象的实例,可以在继承关系中用来判断一个实例是否属于它的父类型。

三、Object.prototype.toString.call 检测

使用Object.prototype上的原生toString()方法判断数据类型,使用方法如下:Object.prototype.toString.call(value)

js判断数据类型方法汇总

在前端开发中我们经用到的操作有很多,比如判断数据类型、去重、深拷贝等等,最近也在整理常用的知识点,便于积累和后期查看,这里呢我对js中数据类型判断方法以及判断结果进行了汇总。

一、汇总表格

二、4种方式说明

1、typeof

对于原始类型:除了null其它都可以显示正确

对于对象的话:除了function  其它均显示为 “object”

2、 instanceof : 内部机制是通过原型链来判断的  方法是  a instanceof b  (a是不是b的实例)

针对于对象:可以很明显的区分Array、Date、regExp,但是他们都是Object的实例。所以,instanceof 最好是用来判断两个对象是否属于实例关系, 而不是判断一个对象实例具体属于哪种类型。

3、constructor a.constructor===Function / Symbol / String / Number / Boolean / Object / RegExp / Date

对于原始类型:无法处理null、undefined(这两个会报错) 

对于对象:均可以判断

函数的 constructor 是不稳定的,这个主要体现在自定义对象上,当开发者重写 prototype 后,原有的 constructor 引用会丢失,constructor 会默认为 Object

4、 toString

toString() 是 Object 的原型方法,调用该方法,默认返回当前对象的 [[Class]] 。这是一个内部属性,其格式为 [object Xxx] ,其中 Xxx 就是对象的类型。

对于 Object 对象,直接调用 toString()  就能返回 [object Object] 。而对于其他对象,则需要通过 call / apply 来调用才能返回正确的类型信息。

可以判断所有类型: Object.prototype.toString.call(xxx)  对向的话可以直接使用 Object.toString(obj)

三、整理一个可以判断任意数据类型的方法

注意:在es6中用class定义类的时候,通过typeof判断出的结果是Function,而通过Object.toString判断的结果是Object。js中class应该是Function类型,所以这点需要注意。

function getType(para) {  //判断任意数据类型

    const type = typeof para;

    if (type === "number" && isNaN(para)) return "NaN";

    if (type !== "object") return type;

    return Object.prototype.toString

        .call(para)

        .replace(/[\[\]]/g, "")

        .split(" ")[1]

        .toLowerCase();

}

四、小结

js中数据类型判断的方式有4种:typeof、instance、constructor、toString,typeof简单方便,比较适合原始类型判断,toString繁琐一点但是判断全面,所以这两个的结合判断我是比较推荐的。

JS有几种方法判断变量的类型?

1、使用typeof检测,当需要判断变量是否是number,string,boolean,function,undefined等类型时,可以使用typeof进行判断。

2、使用instanceof检测,instanceof运算符与typeof运算符相似,用于识别正在处理的对象的类型。与typeof方法不同的是,instanceof方法要求开发者明确地确认对象为某特定类型。

3、使用constructor检测,construction本来是原型对象上的属性,指向构造函数。但是根据实例对象寻找属性的顺序,若实例对象上没有实例属性或方法时,就去原型链上寻找,因此,实例对象也是能使用constructor属性的。

JS有几种方法判断变量的类型?

1、使用typeof检测,当需要判断变量是否是number,string,boolean,function,undefined等类型时,可以使用typeof进行判断。

2、使用instanceof检测,instanceof运算符与typeof运算符相似,用于识别正在处理的对象的类型。与typeof方法不同的是,instanceof方法要求开发者明确地确认对象为某特定类型。

3、使用constructor检测,construction本来是原型对象上的属性,指向构造函数。但是根据实例对象寻找属性的顺序,若实例对象上没有实例属性或方法时,就去原型链上寻找,因此,实例对象也是能使用constructor属性的。

如何判断js中的数据类型

判断js中的数据类型有一下几种方法:typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(),接下来主要比较一下这几种方法的异同。

1、最常见的判断方法:typeof:

2、判断已知对象类型的方法: instanceof:

3、根据对象的constructor判断: constructor:

4、通用但很繁琐的方法: prototype:

5、无敌万能的方法:jquery.type():

通常情况下用typeof 判断就可以了,遇到预知Object类型的情况可以选用instanceof或constructor方法,实在没辙就使用$.type()方法。

JS-判断js数据类型的几种方式

js的数据类型分为两大类:

基本类型:也称为简单类型,由于其占据空间固定,是简单的数据段,为了便于提升变量查询速度,将其存储在栈中,即按值访问

引用类型:也称为复杂类型,由于其值的大小会改变,所以不能将其存放在栈中,否则会降低变量查询速度,因此,其值存储在堆中,而存储在变量处的值,是一个指针,指向存储对象的内存处,即按址访问。引用类型除 Object 外,还包括 Function 、Array、RegExp、Date 等等。

引用类型和基本类型的区别:
1、基本类型按访问

需要注意的是:

A instanceof B用来判断A是否属于B的实例,返回true或者false。

需要注意的是:

ES5中可以用Array.isArray([])来准确判断数组的实例

当创建变量b时,js会在b的原型上添加constructor属性,指向b的引用

js在创建内置对象时,也是这么做的:

Object对象有tostring方法返回:

而非object对象,则需要call/apply才能正确返回类型,返回格式为字符串类型的"[object 数据类型xxx]"

以上几种方式可以在不同场景使用。

JS-判断js数据类型的几种方式

js的数据类型分为两大类:

基本类型:也称为简单类型,由于其占据空间固定,是简单的数据段,为了便于提升变量查询速度,将其存储在栈中,即按值访问

引用类型:也称为复杂类型,由于其值的大小会改变,所以不能将其存放在栈中,否则会降低变量查询速度,因此,其值存储在堆中,而存储在变量处的值,是一个指针,指向存储对象的内存处,即按址访问。引用类型除 Object 外,还包括 Function 、Array、RegExp、Date 等等。

引用类型和基本类型的区别:
1、基本类型按访问

需要注意的是:

A instanceof B用来判断A是否属于B的实例,返回true或者false。

需要注意的是:

ES5中可以用Array.isArray([])来准确判断数组的实例

当创建变量b时,js会在b的原型上添加constructor属性,指向b的引用

js在创建内置对象时,也是这么做的:

Object对象有tostring方法返回:

而非object对象,则需要call/apply才能正确返回类型,返回格式为字符串类型的"[object 数据类型xxx]"

以上几种方式可以在不同场景使用。

如何判断js数据类型与数组的方法实例详解

数据类型判断之typeof

typeof可以解决大部分数据类型的判断,其返回值为一个字符串,该字符串说明运算数的类型。

返回结果:

除了string、number、boolean、undefined这四个类型外,null、object、array返回的都是object类型!!!

对于函数类型返回的则是function,再比如typeof(Date),typeof(eval)等。

js判断数组类型的方法

1) instanceof

instanceof 用于判断一个变量是否某个对象的实例,是一个三目运算式。这个操作符和JavaScript中面向对象有点关系,了解这个就先得了解JavaScript中的面向对象。因为这个操作符是检测对象的原型链是否指向构造函数的prototype对象的。

例子:

2) constructor

在W3C定义中的定义:constructor 属性返回对创建此对象的数组函数的引用

判断各种类型的方法是:

通用的方法:

3) 特性判断

object.isArray() 来判断,目的就是准确地检测一个值是否为数组。IE9+、 Firefox 4+、Safari 5+、Opera 10.5+和Chrome都实现了这个方法。但是在IE8之前的版本是不支持的。

4) Object.prototype.toString.call

JavaScript如何使用运算符和属性判断对象类型的方法总结

JavaScript中检测对象类型的运算符有:typeof、instanceof,还有对象的constructor属性:

1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串。如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在)。 但 typeof 的能力有限,其对于Date、RegExp类型返回的都是"object"。如:

所以它只在区别对象和原始类型的时候才有用。要区一种对象类型和另一种对象类型,必须使用其他的方法。如:instanceof 运算符或对象的 constructor 属。

2)instanceof 运算符。 instanceof 运算符要求其左边的运算数是一个对象,右边的运算数是对象类的名字或构造函数。如果 object 是 class 或构造函数的实例,则 instanceof 运算符返回 true。如果 object 不是指定类或函数的实例,或者 object 为 null,则返回 false。如:

所以,可以用instanceof运算符来判断对象是否为数组类型:

3)constructor 属性。 JavaScript中,每个对象都有一个constructor属性,它引用了初始化该对象的构造函数,常用于判断未知对象的类型。如给定一个求知的值 通过typeof运算符来判断它是原始的值还是对象。如果是对象,就可以使用constructor属性来判断其类型。所以判断数组的函数也可以这样写:

很多情况下,我们可以使用instanceof运算符或对象的constructor属性来检测对象是否为数组。例如很多JavaScript框架就是使用这两种方法来判断对象是否为数组类型。 但是检测在跨框架(cross-frame)页面中的数组时,会失败。原因就是在不同框架(iframe)中创建的数组不会相互共享其prototype属性。例如:

在Ajaxian上看到了一种精确的检测方法,跨原型链调用toString()方法:Object.prototype.toString()。可以解决上面的跨框架问题。 当Object.prototype.toString(o)执行后,会执行以下步骤: 1)获取对象o的class属性。 2)连接字符串:"[object "+结果(1)+"]" 3)返回 结果(2) 例如:

Object.prototype.toString.call([]); // 返回 "[object Array]"

Object.prototype.toString.call(/reg/ig); // 返回 "[object RegExp]"

这样,我们就可以写一个健壮的判断对象是否为数组的函数:

此种方法得到国外多个javaScript大师的认可,在即将发布的jQuery 1.3中将使用这种方法来检测数组。 prototype.js的一个维护者写了下面这个函数,用于获取对象的类型名

扩展一下,用于检测各种对象类型:

本文如未解决您的问题请添加抖音号:51dongshi(抖音搜索懂视),直接咨询即可。

上一篇:

下一篇:

热门图文

  • 所居·营居未就借僧居作者

    《所居·营居未就借僧居》郭祥正作者:郭祥正。《所居·营居未就借僧居》作者:郭祥正。年代:宋代。出生地:当涂(今属安徽)。去世时间:1113年。主要作品:《醉翁操》《春日独酌》《春日独酌》《寄东坡先生自朱崖量移合浦》《西□》等。我们为您从以下几个方面提供所居·营居未就借僧居的详细介绍。一、《所居·营居未就借僧居》的全文 点此查看《所居·营居未就借僧居》的详细内容。营居未就借僧居,贝篆翻寻颇食蔬。独步青苔人散后,旋收红柿鸟分馀。二、《所居·营居未就借僧居》郭祥正其他诗词《春日独酌》、《春日独酌》、《醉翁操》、《访隐者》、《寄东坡先生自朱崖量移合浦》。相同朝代的诗歌;

  • 深居杂兴六首林逋的其他诗词 深居杂兴六首林逋的其他诗词有哪些

    《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。作者:林逋。年代:宋代。我们为您从以下几个方面提供深居杂兴六首的详细介绍。一、《深居杂兴六首》的全文 点此查看《深居杂兴六首》的详细内容。冉冉秋云抱啸台,一兵松竹是闲媒。谁闻济北传兵略,枉说山东出相才。樵褐短长披搕膝,丹炉高下垒悬胎。三千功行无圭角,可望虚皇九锡来。二、《深居杂兴六首》林逋其他诗词《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。相同朝代的诗歌;

  • 深居杂兴六首林逋的其他诗词有哪些

    《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。作者:林逋。年代:宋代。我们为您从以下几个方面提供深居杂兴六首的详细介绍。一、《深居杂兴六首》的全文 点此查看《深居杂兴六首》的详细内容。冉冉秋云抱啸台,一兵松竹是闲媒。谁闻济北传兵略,枉说山东出相才。樵褐短长披搕膝,丹炉高下垒悬胎。三千功行无圭角,可望虚皇九锡来。二、《深居杂兴六首》林逋其他诗词《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。相同朝代的诗歌;

  • 深居杂兴六首林逋的其他诗词

    《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。作者:林逋。年代:宋代。我们为您从以下几个方面提供深居杂兴六首的详细介绍。一、《深居杂兴六首》的全文 点此查看《深居杂兴六首》的详细内容。冉冉秋云抱啸台,一兵松竹是闲媒。谁闻济北传兵略,枉说山东出相才。樵褐短长披搕膝,丹炉高下垒悬胎。三千功行无圭角,可望虚皇九锡来。二、《深居杂兴六首》林逋其他诗词《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。相同朝代的诗歌;

  • 深居杂兴六首林逋其他诗词

    《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。《深居杂兴六首》林逋其他诗词:《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。作者:林逋。年代:宋代。我们为您从以下几个方面提供深居杂兴六首的详细介绍。一、《深居杂兴六首》的全文 点此查看《深居杂兴六首》的详细内容。冉冉秋云抱啸台,一兵松竹是闲媒。谁闻济北传兵略,枉说山东出相才。樵褐短长披搕膝,丹炉高下垒悬胎。三千功行无圭角,可望虚皇九锡来。二、《深居杂兴六首》林逋其他诗词《瑞鹧鸪》、《春日斋中》、《山园小梅·其一》、《山园小梅》、《秋江写望》。相同朝代的诗歌;

Top