js判断类型:typeof Object.prototype.toString instanceof constructor有什么区别?一文讲清楚

相信很多小伙伴在使用js的过程中,经常会需要对js的数据类型进行判断,而js中可以对数据类型进行判断的方法有很多种,最常见的有typeof、Object.prototype.toString、instanceof、constructor这四种,那么他们有什么区别呢?

目录

js数据类型

typeof

为啥typeof会将null判断为object

Object.prototype.toString

instanceof

constructor


js数据类型

先回顾下js的数据类型,js数据类型可分为两大类:

1.基本数据类型:又可以细分为七种:number string boolean undefined null bigint symbol

2.引用数据类型

typeof

基本数据类型均可判断(null除外,typeof会将null判断为object)

引用数据类型只可判断function,其他类型的引用数据均判断为object

//基本数据类型
et str='string'
console.log(typeof str) //stringlet num=1
console.log(typeof num) //numberlet ifRight=true
console.log(typeof ifRight) // booleanlet var1
console.log(typeof var1)  //undefinedlet var2=null
console.log(typeof var2)   //注意这里打印的是objectlet sym=Symbol('sym')
console.log(typeof sym) //symbollet bInt=BigInt('1234567890')
console.log(typeof bInt) //bigint//引用数据类型
function func(){return '3'}
console.log(typeof func) //functionlet arr=new Array()
console.log(typeof arr)    //object

为啥typeof会将null判断为object

之前有次面试,面试官提了一嘴,当时没答上来,后来查了查感觉还挺有意思,贴个当时找的图 

Object.prototype.toString

toString()是object的原型方法, 会返回一个格式为[object xxx]的内部属性,xxx就是对象的数据类型。

Object.prototype.toString可以判断所有的数据类型。

缺点:无法区分string(基本数据类型)和String(对象),number和Numbe等也同理

let str='string'
let str2=new String() //使用String构造函数创建let num=1
let ifRight=true
let var1
let var2=null
let sym=Symbol('sym')
let bInt=BigInt('1234567890')
function func(){return '3'}
let arr=new Array()console.log(Object.prototype.toString.call(str)) // [object String]
console.log(Object.prototype.toString.call(str2)) // [object String],和str的一样console.log(Object.prototype.toString.call(num)) // [object Number]
console.log(Object.prototype.toString.call(ifRight))  // [object Boolean]
console.log(Object.prototype.toString.call(var1))  // [object Undefined]
console.log(Object.prototype.toString.call(var2))  // [object Null]
console.log(Object.prototype.toString.call(sym))  // [object Symbol]
console.log(Object.prototype.toString.call(bInt))  // [object BigInt]
console.log(Object.prototype.toString.call(func))  // [object Function]
console.log(Object.prototype.toString.call(arr))  // [object Array]

instanceof

instanceof运算符用来检测构造函数的ptototype属性是否出现在某个实例对象的原型链上,

所以只能用来判断引用数据类型,不能对基本数据类型进行判断

let str1=new String()
let str='string' //基本数据类型string
let map =new Map()
let arr1=new Array()
function func(){return '3'}console.log(str1 instanceof String)  //true
console.log(str1 instanceof Object)  //trueconsole.log(str instanceof String)  //false 基本数据类型不可检测
console.log(str instanceof Object)  //false 基本数据类型不可检测console.log(map instanceof Map)      //true
console.log(arr1 instanceof Array)   //true
console.log(func instanceof Function) //true

缺点:当一个页面存在多个ifream(也就是存在多个全局变量window),此时instanceof的判断会被来自不同ifream的数据所干扰,导致数据不可信。

constructor

利用原型上的prototype.constructor指向实例的构造函数来进行判断

基本数据类型/引用数据类型均可判断

缺点:和Object.prototype.toString一样,无法区分string(基本数据类型)和String(对象),number和Numbe等也同理

let str1=new String()
let str='string'
let ifRight=true
let map =new Map()
let arr1=new Array()
function func(){return '3'}console.log(str1.constructor===String)  //true
console.log(str.constructor===String)  //true 基本数据也可判断,但是无法和String区分
console.log(str.constructor===Object)  //false
console.log(ifRight.constructor===Boolean)  //true 基本数据类型console.log(map.constructor===Map)     //true
console.log(arr1.constructor===Array)   //true
console.log(func.constructor===Function)  //true

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/55093.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

软件测试之可靠性测试

CNAS标识 软件可靠性测试主要目的是通过在有使用代表性的环境中执行软件,以证实软件需求是否正确实现,为进行软件可靠性估计采集准确的数据,并找出所有对软件可靠性影响较大的错误。可靠性测试的特点是不同于硬件可靠性测试,主要…

最新Nmap入门技术

点击星标,即时接收最新推文 本文选自《web安全攻防渗透测试实战指南(第2版)》 点击图片五折购书 Nmap详解 Nmap(Network Mapper,网络映射器)是一款开放源代码的网络探测和安全审核工具。它被设计用来快速扫…

KUKA机器人零点标定的具体方法

KUKA机器人零点标定的具体方法 在进行机器人校正时,先将各轴置于一个定义好的机械位置,即所谓的机械零点。这个机械零点位置表明了同轴的驱动角度之间的对应关系,它用一个测量刻槽表示。 为了精确地确定机器人某根轴的机械零点位置,一般应先找到其预校正位置,然后去掉测量…

64位ATT汇编语言调用自己编写的两个数相加函数,使用printf输出,发现报错Segmentation fault

cat /etc/redhat-release看到操作系统是CentOS Linux release 7.6.1810,uname -r看到内核版本是3.10.0-957.el7.x86_64,gcc --version可以看到gcc版本是12.2.0,gdb --version可以看到gdb版本是12.1。 twoNumberPlus.s里边的内容如下&#x…

芯科科技宣布推出下一代暨第三代无线开发平台,打造更智能、更高效的物联网

第三代平台中的人工智能/机器学习引擎可将性能提升100倍以上 Simplicity Studio 6软件开发工具包通过新的开发环境将开发人员带向第三代平台 中国,北京 - 2023年8月22日 – 致力于以安全、智能无线连接技术,建立更互联世界的全球领导厂商Silicon Labs&…

提速换挡 | 至真科技用技术打破业务壁垒,助力出海破局增长

各个行业都在谈出海,但真正成功的又有多少? 李宁出海十年海外业务收入占比仅有1.3%,走出去战略基本失败。 京东出海业务磕磕绊绊,九年过去国际化业务至今在财报上都不配拥有姓名。 几百万砸出去买量,一点水花都没有…

小研究 - JVM 逃逸技术与 JRE 漏洞挖掘研究(一)

Java语言是最为流行的面向对象编程语言之一, Java运行时环境(JRE)拥有着非常大的用户群,其安全问题十分重要。近年来,由JRE漏洞引发的JVM逃逸攻击事件不断增多,对个人计算机安全造成了极大的威胁。研究JRE安…

如何使用Wireshark进行网络流量分析?

如何使用Wireshark进行网络流量分析。Wireshark是一款强大的网络协议分析工具,可以帮助我们深入了解网络通信和数据流动。 1. 什么是Wireshark? Wireshark是一个开源的网络协议分析工具,它可以捕获并分析网络数据包,帮助用户深入…

生成模型 -- GAN

文章目录 1. 生成模型与判别模型1.1 生成模型 2. VAE3. GAN3.1 GAN-生成对抗网络3.2 GAN-生成对抗网络的训练3.2.1 判别模型的训练:3.2.2 生成网络的训练: 4. LeakyReLU5. GAN代码实例 1. 生成模型与判别模型 生成模型与判别模型 我们前面几章主要介绍了…

ARM开发,stm32mp157a-A7核(UART总线实验)

1.目标:键盘输入一个字符a,串口工具显示b; 键盘输入一个字符串"nihao",串口工具显示"nihao"; 2.框图分析: 3.代码: ---.h头文件--- #ifndef __UART4_H__ #define __UART4_H__#include "st…

时序预测 | MATLAB实现基于TSO-XGBoost金枪鱼算法优化XGBoost的时间序列预测(多指标评价)

时序预测 | MATLAB实现基于TSO-XGBoost金枪鱼算法优化XGBoost的时间序列预测(多指标评价) 目录 时序预测 | MATLAB实现基于TSO-XGBoost金枪鱼算法优化XGBoost的时间序列预测(多指标评价)预测效果基本介绍程序设计参考资料 预测效果 基本介绍 Matlab实现基于TSO-XGBoost金枪鱼算…

设计模式三原则

1.1单一职责原则 C 面向对象三大特性之一的封装指的就是将单一事物抽象出来组合成一个类,所以我们在设计类的时候每个类中处理的是单一事物而不是某些事物的集合。 设计模式中所谓的单一职责原则,就是对一个类而言,应该仅有一个引起它变化的原…

【MYSQL8.0从入门到精通】

文章目录 MySQL 8.0一.MySQL的多表操作1.外键约束(一对多)2.外键约束(多对多) MySQL 8.0 一.MySQL的多表操作 1.外键约束(一对多) 方式1 在创建表的同时创建外键约束 -- 1.创建主表 create table if no…

13. Docker实战之安装MySQL

目录 1、前言 2、部署MySQL 2.1、Docker仓库查看镜像 2.2、拉取MySQL镜像 2.3、创建持久化目录 2.4、启动MySQL容器 2.5、查看宿主机上的MySQL目录 2.6、本地MySQL测试 2.7、新建MySQL用户,配置远程访问 2.8、本地Navicat连接测试 3、为什么数据库不适合D…

NoSQL数据库介绍+Redis部署

目录 一、NoSQL概述 1、数据的高并发读写 2、海量数据的高效率存储和访问 3、数据库的高扩展和高可用 二、NoSQL的类别 1、键值存储数据库 2、列存储数据库 3、文档型数据库 4、图形化数据库 三、分布式数据库中的CAP原理 1、传统的ACID 1)、A--原子性 …

Spring boot 集成单元测试

1.引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope></dependency> 2. 3.编写测试类 package com.enterprise;import com.enterpr…

Java接收前端请求体方式

&#x1f497;wei_shuo的个人主页 &#x1f4ab;wei_shuo的学习社区 &#x1f310;Hello World &#xff01; 文章目录 RequestBodyPathVariableRequestParamValidated方法参数校验方法返回值校验 RequestHeaderHttpServletRequest ## Java接收前端请求体的方式 请求体&#xf…

VR智慧校园资中控管理平台综合提升了课堂教学质量

随着越来越多高校在课堂中引进VR虚拟仿真实训系统&#xff0c;为了方便老师对全班同学进行高效率地管理&#xff0c;VR中控平台应运而生。下面为您详细介绍VR中控平台在课堂教学中的应用优势。 VR中控系统安装在教师总控端&#xff0c;融合了课件、视频、3D动画等丰富的教学资源…

顺序表链表OJ题(1)——【LeetCode】

W...Y的主页 &#x1f60a; 代码仓库分享 &#x1f495; 前言&#xff1a; 今天我们来回顾一下顺序表与链表&#xff0c;针对这一块我们也有许多OJ题目供大家参考。当我们学习完顺序表链表后避免不了一些习题的练习&#xff0c;这样才能巩固我们学习的内容。 话不多说&#xf…

回归预测 | MATLAB实现BES-ELM秃鹰搜索优化算法优化极限学习机多输入单输出回归预测(多指标,多图)

回归预测 | MATLAB实现BES-ELM秃鹰搜索优化算法优化极限学习机多输入单输出回归预测&#xff08;多指标&#xff0c;多图&#xff09; 目录 回归预测 | MATLAB实现BES-ELM秃鹰搜索优化算法优化极限学习机多输入单输出回归预测&#xff08;多指标&#xff0c;多图&#xff09;效…