JS——判断变量类型方法汇总

article/2025/10/19 13:36:14

判断变量类型

  • 一、使用typeof判断变量类型
  • 二、使用instanceof判断变量的类型
  • 三、使用constructor判断变量的类型
  • 四、使用Object.prototype.toString.call判断变量的类型
  • 五、使用jquery中$.type判断变量的类型。
  • 六、总结

在JS中,有 5 种基本数据类型和 1 种复杂数据类型.
基本数据类型有:Undefined, Null, Boolean, Number和String;
复杂数据类型是Object,Object中还细分了很多具体的类型,比如:Array, Function, Date等等。

那么那些方法可以判断数据类型呢?
为了方便起见,事先定义好需要测试的变量。

var num  = 123;
var str  = 'abcdef';
var bool = true;
var arr  = [1, 2, 3, 4];
var json = {name:'wenzi', age:25};
var func = function(){ console.log('this is function'); }
var und  = undefined;
var nul  = null;
var date = new Date();
var reg  = /^[a-zA-Z]{5,20}$/;
var error= new Error();

一、使用typeof判断变量类型

typeof 是经常使用的方法之一。
使用typeof方法测试提前定义好的变量

console.log(typeof num,//numtypeof str,//stringtypeof bool,//booleantypeof arr,//objecttypeof json,//objecttypeof func,//functiontypeof und,//undefinedtypeof nul,//objecttypeof date,//objecttypeof reg,//objecttypeof error //object
);

查看输出结果可以发现,arr, json, nul, date, reg, error 全部被检测为object类型,未被正确检出。其他的变量能够被正确检测出来。

所以当变量是number, string, boolean, function, undefined, json类型时,可以使用typeof进行判断,而其他变量是判断不出类型的,包括null。

typeof是区分不出array和json类型的。因为使用typeof这个变量时,array和json类型输出的都是object。

二、使用instanceof判断变量的类型

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

function Person(){}
var Tom = new Person();console.log(Tom instanceof Person); 
//必须使用Tom instanceof Person 明确确认对象为Person类型,不可以直接instanceof(Tom)进行判断
// true

举例2:

function Person(){}function Student(){}
Student.prototype = new Person();
var John = new Student();
console.log(John instanceof Student); // true
console.log(John instancdof Person);  // true

instanceof还能检测出多层继承的关系。

使用instanceof方法测试提前定义好的变量

console.log(num instanceof Number,// num : falsestr instanceof String,// str : falsebool instanceof Boolean,// bool : falsearr instanceof Array,// arr : truejson instanceof Object,// json : truefunc instanceof Function,// func : trueund instanceof Object,// und : falsenul instanceof Object,// nul : falsedate instanceof Date,// date : truereg instanceof RegExp,// reg : trueerror instanceof Error// error : true
)

查看上述代码,und和nul是检测的Object类型,才输出的true,因为js中没有Undefined和Null的这种全局类型,他们und和nul都属于Object类型,因此输出了true。

同时,我们可以看到,num, str和bool没有检测出它的类型,但是我们使用new的方式创建num,是可以检测出类型的。如下述代码:

var num = new Number(123);
var str = new String('abcdef');
var boolean = new Boolean(true);

三、使用constructor判断变量的类型

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

我们先来输出一下num.constructor的内容,即数字类型的变量的构造函数是什么样子的:

var num  = 123;
console.log(num.constructor);

我们可以看到它指向了Number的构造函数,因此,我们可以使用num.constructor==Number来判断num是不是Number类型的,其他的变量也类似。
在这里插入图片描述
使用constructor测试提前定义好的变量

function Person(){}var Tom = new Person();
// undefined和null没有constructor属性,没有进行测试
console.log(Tom.constructor==Person,num.constructor==Number,str.constructor==String,bool.constructor==Boolean,arr.constructor==Array,json.constructor==Object,func.constructor==Function,date.constructor==Date,reg.constructor==RegExp,error.constructor==Error
);
// 所有结果均为true

从输出的结果我们可以看出,除了undefined和null,其他类型的变量均能使用constructor判断出类型。

但是,constructor也不是保险的,因为constructor属性是可以被修改的, 导致检测出的结果不正确。

举例:
Student原型中的constructor被修改为指向到Person,导致检测不出实例对象John真实的构造函数。

举例:

function Person(){}
function Student(){}
Student.prototype = new Person();
var John = new Student();
console.log(John.constructor==Student); // false
console.log(John.constructor==Person);  // true

同时,使用instaceof和construcor,被判断的array必须是在当前页面声明的!比如,一个父页面有一个框架,框架中引用了一个子页面,在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array == object.constructor;会返回false。

原因:
1、array属于引用型数据,在传递过程中,仅仅是引用地址的传递。

2、每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array,所对应的构造函数,是子页面的Array对象;父页面来进行判断,使用的Array并不等于子页面的Array。

四、使用Object.prototype.toString.call判断变量的类型

使用toString.call测试提前定义好的变量

console.log(Object.prototype.toString.call(num),Object.prototype.toString.call(str),Object.prototype.toString.call(bool),Object.prototype.toString.call(arr),Object.prototype.toString.call(json),Object.prototype.toString.call(func),Object.prototype.toString.call(und),Object.prototype.toString.call(nul),Object.prototype.toString.call(date),Object.prototype.toString.call(reg),Object.prototype.toString.call(error)
);// '[object Number]' '[object String]' '[object Boolean]' '[object Array]' '[object Object]'
// '[object Function]' '[object Undefined]' '[object Null]' '[object Date]' '[object RegExp]' '[object Error]'

从输出的结果来看,Object.prototype.toString.call(变量)输出的是一个字符串,字符串里有一个数组,第一个参数是Object,第二个参数就是这个变量的类型,而且,所有变量的类型都检测出来了,我们只需要取出第二个参数即可。或者可以使用Object.prototype.toString.call(arr)=="object Array"来检测变量arr是不是数组。

Object.prototype.toString的查询行为:首先,取得对象的一个内部属性[[Class]],然后依据这个属性,返回一个类似于”[object Array]“的字符串作为结果(ECMA标准中,[[]]用来表示语言内部用到的、外部不可直接访问的属性,称为“内部属性”)。利用这个方法,再配合call,我们可以取得任何对象的内部属性[[Class]],然后把类型检测转化为字符串比较,以达到我们的目的。

五、使用jquery中$.type判断变量的类型。

在jquery中提供了一个$.type的接口,来让我们检测变量的类型。

console.log($.type(num),$.type(str),$.type(bool),$.type(arr),$.type(json),$.type(func),$.type(und),$.type(nul),$.type(date),$.type(reg),$.type(error)
);
// number string boolean array object function undefined null date regexp error

和toString.call一样所有变量的类型都可以检测出来。

六、总结

  1. 一般简单的使用 typeof 或 instanceof 检测(这两种检测不完全准确)
  2. 原生js中的 Object.prototype.toString.call 或 jquery中的 $.type 检测(完全准确)
    在这里插入图片描述

http://chatgpt.dhexx.cn/article/CYRvHHTA.shtml

相关文章

JavaScript中的类型判断

js中的类型判断 1、使用typeof进行类型判断2、使用 instanceof 判断对象3、使用Array.isArray()判断数组 1、使用typeof进行类型判断 function fun() { }; console.log("数字的类型为:" typeof (1)); console.log("字符串的类型为:&quo…

js:判断数据类型的几种方法

参考文章:JavaScript中判断对象类型的几种方法总结 根据要判断的数据对象,来选用合适的方法 1、原始数据类型 6种:number、string、boolean、undefined、null、symbol 一、typeof let str hello; console.log(typeof str); // string【特…

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

JS中常见的几种数据类型 基本类型:string、boolean、number特殊类型:undefined和null3、引用类型:Array、Date、RegExp… typeof typeof检测基本数据类型时没有问题,但是当其对引用类型进行检测时,会返回object&…

js 精确判断对象的类型

在 JavaScript 里使用 typeof 来判断数据类型,只能区分基本类型,即 “number”,”string”,”undefined”,”boolean”,”object” 五种。 对于数组、函数、对象来说,其关系错综复杂&#xff0c…

JavaScript——判断js数据类型(类型检测)

判断js数据类型,也就是我们说的类型检测,本文提供五种方法,分别是typeof运算符、instanceof操作符、Object.prototype.toString方法、constructor属性、duck type。 1、typeof运算符 typeof算是最常见的了,使用它会返回一个字符…

js判断数据类型常用的6种方法

js判断数据类型常用的方法,不论在开发中开始在面试中,都是经常遇到的问题,尤其是在面试时,当面试官问及js判断数据类型的方法时,回答的越多,说明掌握的广度跟深度越多,感觉自己逼格也越高.废话不多说了,进入正题 常见的判断js数据类型的方法有如下几种 1.最常见的判断方法&am…

js判断数据类型的几种方法

第一种:Object.prototype.toString()方法: 注意这里是Object原型对象上的toString方法才能判断,其他原型对象上的不能判断,如 Array原型对象上的toString方法是判断不了的,因为它重写了toString方法。 要使用Object…

js判断数据类型(全)

js基本数据类型 基本数据类型: String、Number、Boolean、Undefined未定义、null空、symbol表示独一无二的值(es6引入的新的原始数据基本类型)。 Number:返回的特殊值NaN,表示不是数值,用于表示本来要返回…

判断JS数据类型的五种方法

JavaScript 中常见的几种数据类型: 目录 JavaScript 中常见的几种数据类型: 一、分类 二、判断 1、typeof null既然属于基本数据类型,为什么用typeof返回的是object呢? js小数运算出现的问题(精度丢失) 解决方法一 解决方…

Linux 文件类型及常用命令(2)(cp、mv、cat、more、less、head、tail、chmod、getenforce)

1、命令 cp:拷贝(类似于Windows系统的复制,但区别是可以重命名) 拷贝文件、目录(需要使用 -r 参数),可以重命名。 2、命令 mv:移动或重命名 ①如果是在当前目录下移动&#xff0c…

Linux验证SELinux状态

安全增强型Linux(SELinux)是一个Linux内核的功能,它提供支持访问控制的安全政策保护机制。记录操作如何验证SELinux,并且避免系统无法启动的问题。 以root权限执行:sudo su - 运行命令getenforce,验证SELi…

Linux 查看 SELinux 的状态

可以运行下面的命令来查看当前服务配置的 SELinux 的状态。 getenforce 上面的输出状态显示了当前 SELinux 的配置状态。 如果上图显示当前的状态。 临时禁用 SELinux 。 使用下面的命令来临时禁用 SELinux。 setenforce 0 Linux 查看 SELinux 的状态 - 系统和容器 - OSSE…

Android Senlinux 基础说明

一、SELinux 三种模式简介 Enforcing:强制模式。代表SELinux在运行中,且已经开始限制domain/type之间的验证关系Permissive:宽容模式。代表SELinux在运行中,不过不会限制domain/type之间的验证关系,即使验证不正确&…

如何关闭防火墙和selinux操作

在每次部署相关软件的时候总是会遇到各种奇奇怪怪的问题,多半是防火墙没有关,或者是selinux没有关 如何关闭防火墙: 那先来看一下防火墙的状态:systemctl status firewalld 如果是下图所示开着的,那就把它给关了&am…

Linux下如何关闭SELinux的图文教程(完整版)

大家好! 最近遇到Mysql数据启动报错的问题,于是发现是因为SELinux没有关闭,那么这篇文章就简单的记录SElinux是如何让关闭的。 前言 SELinux(Security-Enhanced Linux) 是美国国家安全局(NSA)对于强制访问控制的实现…

Android8.x/9.x/10.x user版本关闭selinux以及打开UART控制台输入和关闭内核日志输出功能

1、user版本关闭selinux 仅限于系统调试时使用,量产版本需要将其设置回去成ELINUX_ENFORCING模式。 1.1)背景 C:\Users\zhaojr> adb root C:\Users\zhaojr> adb remount C:\Users\zhaojr> adb shell ac8257:/ # getenforce getenforce Enforcing这个表明…

GeForce Experience 绕过登录与禁止自动更新

本文说明了,如何在未注册Nvidia账户的情况下,绕过GeForce Experience(以下简称为GFE)账户登录的方法,从而直接使用登陆后才能使用的各种功能。在PC未联网的情况下,此方法依旧能正常绕过登录,直接…

adb shell getenforce/setenforce(三级命令)

adb shell getenforce adb shell setenforce

PyTorch官方教程(中文版)

PyTorch官方教程(中文版) TENSOR概述初始化向量对Tensor的操作转移存储位置到GPU张量的切片操作张量的合并操作张量乘法将单元素tensor转换为基本数据类型 与NumPy的联系tensor转numpynumpy转tensor DATASETS & DATALOADERS载入数据集迭代和可视化数…

pytorch基础教程(目标检测)

文章目录 1 python ;两大法宝函数2 加载数据3 TensorBoard 的使用4 transforms的使用5 torchvision中的数据集使用6 dataloader的使用7 卷积操作8 卷积层9 最大池化10 非线性激活11 线性层12 Sequential的使用13 损失函数14 优化器15 现有网络模型的使用及修改16 网…