当前位置: 首页 > news >正文

js判断数据类型的几种方法及其局限性(typeof, instanceof, Object.prototype.toString.call())


js中判断了类型的方法有很多, 这篇文章主要来说一下常用的几种判断类型的方法,以及使用:

每个方法都各有优缺点,在日常使用的时候请结合这些优缺点进行斟酌:

1. 使用typeof判断数据类型

javaScript中typeof可以判断以下类型:

  1. undefined: 未定义的变量或者值

  2. boolean: 布尔类型, true 或false

  3. number: 数值类型, 包括整数,浮点数, NaN, 和Infinity (无穷大)

  4. string: 字符串类星星, 表示文本

  5. symbol:符号类型,ES6中新增的基本数据类型

  6. function: 函数类型,可以作为一种特殊的对象类型

以下未测试代码以及输出内容:

let num = 213
console.log('type num=', typeof num) // numberlet str = '123'
console.log('type str=', typeof str) //stringlet nullValue = null
console.log('type nullValue=', typeof nullValue) // objectlet undefinedValue = undefined
console.log('type undefinedValue=', typeof undefinedValue)// undefinedlet obj = {name:'卡卡西',age:12}
console.log('type obj=', typeof obj) // objectlet boolValue = true
console.log('type boolValue=', typeof boolValue) //booleanlet symbolValue = Symbol('kk')
console.log('type symbolValue=', typeof symbolValue) //symbolfunction fun() {}
console.log('type fun=', typeof fun) //functionlet arr = [1,2,3]
console.log(typeof arr) // object

需要注意的是null和arr这些也是typeof判断类型的局限性所在;

typeof判断类型的局限性:

  1. typeof null的结果是object: 这是一个历史遗留问题, 在JavaScript最初的实现中将null的类型判断错误地设为object,因此使用typeof操作符判断null的时候得到的结果是object而不是null
  2. typeof数组|对象 返回的结果也是object: 虽然数组和对象在JavaScript中分别属于两种不同的数据类型,但是使用typeof判断他们的结果都是’object’ 无法区分他们的具体类型
  3. 不能判断自定义对象类型:使用typeof操作符无法自定义对象的具体类型,因为所有的自定义对象都被视为一种object类型

需要注意的是,typeof能够快速判断出一些简单的类型的数据,但是对于复杂的数据类型判断会有一定的局限性,因此在实际编写代码时,需要结合其他的方法和技巧来判断数据类型

2. 使用instanceof判断类型

instanceof是javaScript中的一种运算符,用于判断某个对象是否属于某个类(或其父类)的实例,语法如下

object instance of constructor

测试代码如下:


function Person(name) {this.name = name;
}let person1 = new Person('卡卡西')console.log(person1 instanceof Person) // trueconsole.log('Person',Person) //[Function: Person]console.log('person1',person1) //Person { name: '卡卡西' }console.log('Person()',Person()) //undefinedclass A {}
class B extends A {}let b = new B()
console.log(b instanceof B) // true
console.log(b instanceof A) //trueclass Animal {}
const dog = {};
dog.constructor = Animal;
console.log(dog instanceof Animal); // false

虽然instanceof运算符可以用来判断是否属于某个类的实例,但是他也存在一些局限性:

  1. 无法判断基本数据类型: instanceof 只能判断对象是否属于某个类的实例,不能判断基本数据类型,比如字符串,数字,如果要判断基本数据类型,需要使用其他方法
  2. construct 属性可能被篡改: instanceof 的判断依赖于对象的construct属性,如果对象的constructor属性被修改或篡改,那么instanceof就无法正确判断对象所属的类
  3. 原型链较深时效率较低:instanceof 的判断是基于原型链的,当原型链较深时,instanceof 的效率会较低,因为它需要遍历整个原型链才能找到判断条件中的构造函数。
    综上所述,虽然 instanceof 运算符在某些情况下可以很方便地判断对象所属的类,但是在实际开发中需要注意其局限性,并结合其他方法和技巧来进行类型判断。

3. 使用Object.toString.call()判断数据类型

使用Object.toString.call()可以用来判断:

  1. 判断基本数据类型
  2. 判断复杂数据类型
  3. 判断null和undefined

需要注意的是,Object.prototype.toString 方法返回的字符串格式为 “[object 数据类型]”,其中数据类型和 JavaScript 中的数据类型名称一致。此外,由于该方法是 Object 类型的原型方法,因此需要通过 call 方法来调用,确保 this 指向正确。

const num2 = 0;
console.log('object.toString.call(num2)',Object.prototype.toString.call(num2))//[object Number]const str1 = '卡卡西'
console.log('object.toString.call(str1)',Object.prototype.toString.call(str1))// [object String]const obj2 = {name:'佐助',age:'23'}
console.log('object.toString.call(obj2)',Object.prototype.toString.call(obj2))//[object Object]const arr2 = [1,2,3,4];
console.log('object.toString.call(arr2)',Object.prototype.toString.call(arr2))//[object Array]const nullValue2 = null
console.log('object.toString.call(nullValue2)',Object.prototype.toString.call(nullValue2))//[object Null]class Student {name;constructor(name) {this.name = name;}}const student1 = new Student('周周');
console.log('object.toString.call(student1)',Object.prototype.toString.call(student1))// [object Object]class Student2 {name;constructor(name) {this.name = name;}toString(){console.log(this.name)}// 重写 Symbol.toStringTag 属性get [Symbol.toStringTag]() {return 'Student2';}
}const student2 = new Student2('周周')
console.log('object.toString.call(student2)',Object.prototype.toString.call(student2))// [object Student2]

Object.prototype.toString.call()方法判断类型的局限性:

  1. 无法准确判断自定义类型: Object.prototype.toString.call 方法虽然可以准确地判断内置对象(例如 Array、Object、Function 等)和基本数据类型,但无法准确地判断开发者自定义的类。如果想让他能判断自定义类型需要重写Symbol.toStringTag 属性
  2. 不能区分继承关系: Object.prototype.toString.call 方法只能根据对象的原型链进行判断,无法区分不同构造函数创建的相似对象的继承关系,
    4.不能跨域判断:由于 JavaScript 中的安全机制,当脚本执行跨域操作时,Object.prototype.toString.call 方法也可能会返回错误的结果。这是因为部分浏览器实现了“沙箱”机制,阻止了跨域脚本访问其他域名下的对象。

相关文章:

js判断数据类型的几种方法及其局限性(typeof, instanceof, Object.prototype.toString.call())

​ js中判断了类型的方法有很多, 这篇文章主要来说一下常用的几种判断类型的方法,以及使用: 每个方法都各有优缺点,在日常使用的时候请结合这些优缺点进行斟酌: 1. 使用typeof判断数据类型 javaScript中typeof可以判断以下类型: undefined: 未定义的变量或者值 boolean: 布…...

【MySQL】一文带你掌握聚合查询和联合查询

文章目录 1. 聚合函数1.1 COUNT1.2 SUM1.3 AVG1.4 MAX,MIN 2. GROUP BY3. HAVING4. 联合查询4.1 内连接4.2 外连接4.3 自连接4.4 子连接 5.合并查询5.1 UNION5.2 UNION ALL 1. 聚合函数 概念: 聚合函数是一种用于处理数据集合的函数,它将多个…...

初步了解JVM

JVM 整体组成部分 类加载器 类加载过程 加载:使用IO读取字节码文件,转换并存储,为每个类创建一个Class对象,存储在方法区中 链接(验证,准备,解析) ​ 验证:对字节码文件格式进…...

嘀嗒陪诊小程序v1.0.8+小程序前端

嘀嗒陪诊小程序功能相对简单,后台也简捷,如果只是做个陪诊服务的小程序也基本能满足了,整体测试了下海参崴发现BUG,小程序端也能正常为使用,唯一用户授权接口是老的。 应用背景:人口老龄化少子化&#xff…...

Java中线程的生命周期

Java中线程的生命周期 Java中线程的声明周期与os中线程的生命周期不太一样,java中线程有6个状态,见下: NEW: 初始状态,线程被创建出来但没有被调用 start() 。RUNNABLE: 运行状态,线程被调用了 start()等待运行的状态…...

光线追踪RayTracing,基本原理,判断物体与光线相交

光线的三点假设: 光线按直线传播光线之间不会发生碰撞光线会经过一系列折射反射进入摄像机 可以从摄像机发出光线,推出可逆的光路 上图中,透明球在与相机直连的线条处,需要将折射和反射的着色点结果相加,如果有光源直…...

三十六、数学知识——组合数(递推法 + 预处理法 + 卢卡斯定理 + 分解质因数求解组合数 + 卡特兰数)

组合数算法主要内容 一、基本思路1、组合数基本概念2、递推法——询问次数多 a b 值较小 模处理(%mod)3、预处理阶乘方法——询问次数较多 a b 值很大 模处理(%mod)4、卢卡斯定理——询问次数较少 (a b 值很大&am…...

LinuxC编程——高级文件操作

目录 一、查询文件信息1、stat2、stat fstat lstat区别 二、目录操作2.1 opendir2.2 readdir2.3 closedir例练习:实现ls操作 三、库3.1 库的定义3.2 库的分类3.2.1 静态库3.2.2 动态库 3.3 创建库3.3.1 静态库制作3.3.2 动态库制作 一、查询文件信息 1、stat int …...

【基础知识整理】图的基本概念 邻接矩阵 邻接表

一、图概述 定义: 图(graph)是由一些点(vertex)和这些点之间的连线(edge)所组成的; 其中,点通常被成为"顶点(vertex)“,而点与点之间的连线则被成为"边或弧”(edege)。 通常记为,G(V,E)。 图是一种重要的…...

5.程序控制结构|Java学习笔记

文章目录 程序流程控制介绍顺序控制分支控制分支控制if elseswitch分支结构 循环控制for循环控制while循环控制do...while循环控制跳转控制语句breakcontinuereturn 程序流程控制介绍 顺序控制分支控制循环控制 顺序控制 程序从上到下逐行地执行,中间没有任何判断…...

【最优PID 整定】PID性能指标(ISE,IAE,ITSE和ITAE)优化、稳定性裕量(Matlab代码实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…...

Linux内核中断和Linux内核定时器

目录 Linux内核中断 Linux内核定时器 Linux内核中断 int request_irq(unsigned int irq, irq_handler_t handler, unsigned long flags,const char *name, void *dev) 功能:注册中断 参数: irq : 软中断号 gpio的软中断号 软中断号 gpio_to_i…...

OMG--IDL(Interface Definition Language)

OMG--IDL(Interface Definition Language) 1 概述2 内容缩写IDL 语法和语义概述词法约定ISO Latin-1的字母字符如下表十进制数字字符图形字符格式化字符Tokens注释标识符冲突规则转义标识符关键字IDL识别的其他字符字面量 预处理IDL 语法构建块核心数据类…...

英语学习:M开头

machine 机器 mad 发疯的,生气的 madam 女士,夫人 madame 夫人 magazine 杂志 magic 有魔力的 maid 女仆,侍女 mail 邮递 mailbox 邮箱 mainland 大陆 major 较大的,主要的 majority 大多数 male 雄的 man 人类 man…...

【计算机组成原理与体系结构】控制器

目录 一、CPU的功能与基本结构 二、指令周期的数据流 三、数据通路 四、硬布线控制器 五、微程序控制器 六、微指令 一、CPU的功能与基本结构 运算器基本结构 控制器基本结构 CPU的基本结构 二、指令周期的数据流 取址周期 间址周期 中断周期 指令周期流程 三、数据通路 …...

结构化命令

章节目录: 一、使用 if-then 语句二、if-then-else 语句三、嵌套 if 语句四、test 命令4.1 数值比较4.2 字符串比较4.3 文件比较 五、复合条件测试六、if-then 的高级特性6.1 使用单括号6.2 使用双括号6.3 使用双方括号 七、case 命令八、结束语 本章内容&#xff1…...

Java Web实训项目:西蒙购物网

文章目录 一、创建数据库和表1、创建数据库2、创建用户表3、创建类别表4、创建商品表5、创建订单表 二、创建Simonshop项目1、创建web项目2、修改Artifacts名称:simonshop3、重新部署项目4、编辑首页5、启动应用,查看效果 三、创建实体类1、用户实体类2、…...

ChatGPT Prompt 提示词设计技巧必知必会

本文内容整理自图灵社区直播《朱立成:ChatGPT Prompt提示词技巧必知必会》。 朱立成,图灵社区《ChatGPT即学即用》视频课程作者,软件工程师,对新事物充满好奇,关注ChatGPT应用。2001年毕业于浙江大学,从事软…...

尚硅谷-云尚办公-项目复盘

尚硅谷-云尚办公-项目复盘 资料地址本文介绍问题汇总问题1.knife4j无法下载 视频4问题2.dev等含义 视频5问题3.wrapper继承/实现图 视频8问题4.修改统一返回结果 视频11问题5.修改后新增也变修改 视频29问题6.redis中key值乱码 视频55-60问题7.RangeError: Maximum call stack …...

nacos升级到2.0.3(单机模式)

前提&#xff1a;https://github.com/alibaba/spring-cloud-alibaba/wiki/版本说明 Spring Cloud AlibabaSpring CloudSpring BootNacos2.2.7.RELEASESpring Cloud Hoxton.SR122.3.12.RELEASE2.0.3 一、pom.xml文件 <parent><groupId>org.springframework.boot&…...

Koa学习3:用户添加、错误处理

模型 在src目录下创建model目录&#xff0c;用来存放模型 创建用户模型 user.model.js 注意&#xff1a; UUID类型是无法自增的&#xff0c;将id设置为UUID类型时只需要为其指定默认值即可 // 数据类型 const { DataTypes } require(sequelize); // 导入已经连接了数据库…...

网络安全入门学习第十五课——PHP基础

文章目录 一、WEB技术1、什么是web2、B/S架构3、C/S架构 二、PHP概述1、PHP是什么2、PHP受欢迎的原因3、基于MVC模式的PHP框架4、常用编译工具5、PHP环境搭建6、开发工具 三、PHP基本语法格式1、标记2、输出语句3、注释4、标识符 四、数据与运算1、常量1.1、常量定义1.2、预定义…...

电子科技大学 数学专业-功不唐捐,玉汝于成

电子科技大学 数学专业 功不唐捐&#xff0c;玉汝于成 1.本科背景 本科是坐落于湖南湘潭的湖南科技大学&#xff0c;专业为网络工程专业&#xff0c;因热爱数学专业&#xff0c;所以决定跨考数学专业。 本科专业课平均成绩85&#xff0c;排名10/104。CET 4 474分&#xff0c;…...

Android10.0 iptables用IOemNetd实现删除子链功能的实现

1.前言 在10.0的系统rom定制化开发中,在system中netd网络这块的产品需要中,会要求设置屏蔽ip地址之内的功能, liunx中iptables命令也是比较重要的,接下来就来在IOemNetd这块实现删除创建子链的相关功能 2. iptables用IOemNetd实现删除创建子链功能的实现的核心类 syste…...

OpenGL光照之光照贴图

文章目录 漫反射贴图镜面光贴图放射光贴图代码 每个物体都拥有自己独特的材质从而对光照做出不同的反应的方法。这样子能够很容易在一个光照的场景中给每个物体一个独特的外观&#xff0c;但是这仍不能对一个物体的视觉输出提供足够多的灵活性。 我们将整个物体的材质定义为一个…...

2018~2019 学年第二学期《信息安全》考试试题(B 卷)

北京信息科技大学 2018 ~2019 学年第 2 学期 《信息安全》课程期末考试试卷 B 课程所在学院:计算机学院 适用专业班级:计科 1601-06&#xff0c;重修 考试形式:(闭卷) 一. 选择题(本题满分 10 分&#xff0c;共含 10 道小题&#xff0c;每小题 1 分) 网络中存在的安全漏洞主…...

LeetCode-C#-0002.两数相加

0.声明 该题目来源于LeetCode 如有侵权&#xff0c;立马删除。 解法不唯一&#xff0c;如有新解法可一同讨论。 1.题目 0002两数相加 给你两个非空的链表&#xff0c;表示两个非负的整数&#xff0c;它们每位数字都是按照逆序的方式存储的&#xff0c;并且每个节点只能存储一…...

访问修饰符private,default,protected,public访问等级区别

private&#xff1a;private是最严格的访问修饰符&#xff0c;它将成员声明为私有的。私有成员只能在声明它们的类内部访问&#xff0c;其他类无法直接访问私有成员。这样可以确保数据的封装性和安全性。 default&#xff08;默认&#xff09;&#xff1a;如果没有明确指定访问…...

阿里云(Linux)安装Docker教程

首先安装docker&#xff0c;需要找到帮助文档&#xff0c;那肯定是我们的官网&#xff1a; Install Docker Engine on CentOS | Docker Documentation 找到对应的位置&#xff0c;这里是安装在CentOS中&#xff0c;版本需要Ce…...

Linux C编程基础:获取时间

1.前言 对于linux下的编程&#xff0c;无论是用户态还是内核态&#xff0c;时间获取都是经常需要使用到的。以下分别从用户态和内核态整理了几个常用的时间获取接口&#xff0c;供编写代码时快速查阅。 2.用户态获取时间 2.1 clock_gettime() #include <time.h>int c…...

微信网站建设报价/seo静态页源码

设 计 总 说 明 现在社会随着计算机技术迅速发展与技术的逐渐成熟&#xff0c;信息技术已经使人们的生活发生深刻的变化。生活中的各种服务系统也使人们在生活中的联系日常销售活动方式发生了很大的变化&#xff0c;让效率较低的手工操作成为过去&#xff0c;而换成信息化自动化…...

做cosplay网站教程/郑州网站seo外包

? “Python猫” &#xff0c;一个值得加星标的公众号剧照 | 《犬夜叉》“ 如果你的Linux服务器突然负载暴增&#xff0c;告警短信快发爆你的手机&#xff0c;如何在最短时间内找出Linux性能问题所在&#xff1f;来看Netflix性能工程团队的这篇博文&#xff0c;看它们通过十条命…...

制定一个网站建设方案/seo培训

事实上&#xff0c;在选择道路的时候&#xff0c;出了点问题。 问题一&#xff1a;之前在显示道路的时候&#xff0c;每取两个点就画了一条线显示&#xff0c;以至于选择道路时&#xff0c;只选中了两点间的一线&#xff0c;事实上&#xff0c;一条路可能是多个点组成的&#x…...

网站域名空间一年多少钱/最近的新闻大事

php合并数组中相同元素的方法本文实例讲述了php合并数组中相同元素的方法。分享给大家供大家参考。具体如下&#xff1a;关于重复数组的删除我们都介绍过N种方法了&#xff0c;今天这个例子有点不同就是 删除数组中相同的元素&#xff0c;只保留一个相同元素&#xff0c;具体实…...

汽车技术支持 武汉网站建设/域名关键词排名查询

前言这是作者修改后的Linux下的小米随身WiFi驱动&#xff0c;支持Ap模式&#xff0c;开源&#xff0c;同时支持360随身WiFi二代和小度WiFiQQ群(随身WiFi_Linux_Ap)389615079 注意&#xff1a;1.这个是Lin前言这是作者修改后的Linux下的小米随身WiFi驱动&#xff0c;支持Ap模式&…...

邮箱企业邮箱登录入口/邯郸seo优化公司

很多时候&#xff0c;我们需要在eclipse那里打开选中文件(文件夹&#xff0c;包)的当前目录&#xff0c;在资源管理器那里显示这个目录&#xff0c;这个时候&#xff0c;我们又不想采用“选中文件/文件夹/包名--右击--Properties--Location--复制路径--打开我的电脑--粘贴地址-…...