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) //string

let num=1
console.log(typeof num) //number

let ifRight=true
console.log(typeof ifRight) // boolean

let var1
console.log(typeof var1)  //undefined

let var2=null
console.log(typeof var2)   //注意这里打印的是object

let sym=Symbol('sym')
console.log(typeof sym) //symbol

let bInt=BigInt('1234567890')
console.log(typeof bInt) //bigint

//引用数据类型
function func(){return '3'}
console.log(typeof func) //function

let 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)  //true

console.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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

计算机竞赛 基于GRU的 电影评论情感分析 - python 深度学习 情感分类

文章目录 1 前言1.1 项目介绍 2 情感分类介绍3 数据集4 实现4.1 数据预处理4.2 构建网络4.3 训练模型4.4 模型评估4.5 模型预测 5 最后 1 前言 🔥 优质竞赛项目系列,今天要分享的是 基于GRU的 电影评论情感分析 该项目较为新颖,适合作为竞…

IDEA常用插件之注解插件

文章目录 注解插件JavaDoc插件安装修改配置生成文档加入自己信息 Easy JavaDoc安装插件在线安装离线安装中文名自动转英文加注释默认快捷键(可通过IDEA快捷键设置修改) 注解插件 JavaDoc插件 安装 修改配置 生成文档加入自己信息 Easy JavaDoc 中文文…

视频集中存储/直播点播平台EasyDSS内核无法启动是什么原因?

视频推拉流EasyDSS视频直播点播平台,集视频直播、点播、转码、管理、录像、检索、时移回看等功能于一体,可提供音视频采集、视频推拉流、播放H.265编码视频、存储、分发等视频能力服务。 有用户反馈,下载了视频直播点播平台EasyDSS最新版本&a…

STP知识点总结

目录 一.什么是STP协议 二.STP生成树协议产生的原因 三. STP生成树协议涉及的算法 一.802.1D 二.PVST 三.PVST 四. 快速生成树 五.MSTP 一.什么是STP协议 在一个二层交换网络中,生成一棵树型结构,逻辑的阻塞部分接口,使得从根到所有的…

计算机网络第3章(数据链路层)

计算机网络第3章(数据链路层) 3.1 数据链路层概述3.1.1 概述3.1.2 数据链路层使用的信道3.1.3 三个重要问题 3.2 封装成帧3.2.1 介绍3.2.2 透明传输3.2.3 总结 3.3 差错检测3.3.1 介绍3.3.2 奇偶校验3.3.3 循环冗余校验CRC(Cyclic Redundancy Check)3.3.…

RISC-V公测平台发布 · 在SG2042上配置Jupiter+Octave科学计算环境

简介 JupyterHub是一个开源的共享计算平台,它为每个用户管理一个单独的 Jupyter 环境, 可以用于学生班级、企业数据科学小组或科学研究小组。它是一个多用户中心,可以生成、管理和代理多个单用户Jupyter笔记本服务器的实例。 GNU Octave是一…

市面上那里有稳定L2股票行情数据接口?

随着市场的发展和技术的进步,level2股票行情数据接口已经成为股票交易软件的标准配置之一。虽然这些券商软件的功能在很大程度上相似,但它们仍然有自己的特点和优势。 例如:通过股票交易所以其专业的研究报告和丰富的信息服务而受到广泛关注&…

计算机网络(9) --- 数据链路层与MAC帧

计算机网络(8) --- IP与IP协议_哈里沃克的博客-CSDN博客IP与IP协议https://blog.csdn.net/m0_63488627/article/details/132155460?spm1001.2014.3001.5502 目录 1.MAC帧 1.MAC地址 2.MAC帧报头 3.资源碰撞 4.MTU 1.对IP协议的影响 2.对UDP协议…

什么是深拷贝和浅拷贝?

面试回答 在计算机内存中,每个对象都有一个地址,这个地址指向对象在内存中存储的位置。当我们使用变量引用一个对象时,实际上是将该对象的地址赋值给变量。因此,如果我们将一个对象复制到另一个变量中国,实际上是将对象…

【开个空调】语音识别+红外发射

废话少说,直接上空调板子:YAPOF3。红外接收发射模块用的某宝上发现的YF-33(遗憾解码还没搞清楚,不然做个lirc.conf功能才多)。最后是语音识别用的幻尔的,某宝自然也有,它是个i2c的接口。 本篇胡说八道其实纯粹为了留个…

什么是遗传算法(Genetic Algorithm,简称 GA)?

目录 一、遗传算法介绍二、遗传算法应用场景三、遗传算法具体案列1、求解旅行商问题(TSP 问题)2、求解一个矩阵中的最大值3、基于遗传算法的图像压缩方法 四、遗传算法重要意义五、生物进化与遗传算法之间的关系 一、遗传算法介绍 遗传算法(…

基于PHP的电脑商城系统

有需要请加文章底部Q哦 可远程调试 基于PHP的电脑商城系统 一 介绍 此电脑商城系统基于原生PHP开发,数据库mysql,前端bootstrap。用户可注册登录,购物下单,评论等。管理员登录后台对电脑商品,用户,订单&a…

C语言小白急救 指针进阶讲解1

文章目录 指针一、 字符指针二、 指针数组三、数组指针1.数组的地址2.数组指针3.数组指针的应用 四、数组参数、指针参数1. 一维数组传参2.二维数组传参3.一级指针传参4.二级指针传参 五、函数指针1.函数的地址2.函数指针3.练习 指针 指针的概念: 1.指针就是个变量…

时序预测 | Matlab实现SO-CNN-GRU蛇群算法优化卷积门控循环单元时间序列预测

时序预测 | Matlab实现SO-CNN-GRU蛇群算法优化卷积门控循环单元时间序列预测 目录 时序预测 | Matlab实现SO-CNN-GRU蛇群算法优化卷积门控循环单元时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 时序预测 | Matlab实现SO-CNN-GRU蛇群算法优化卷积门控循环单…

分类预测 | MATLAB实现S4VM半监督支持向量机二分类预测

分类预测 | MATLAB实现S4VM半监督支持向量机二分类预测 目录 分类预测 | MATLAB实现S4VM半监督支持向量机二分类预测分类效果基本介绍程序设计参考资料 分类效果 基本介绍 分类预测 | MATLAB实现S4VM半监督支持向量机二分类预测 程序设计 完整源码和数据获取方式: …

Spring Cache的介绍以及怎么使用(redis)

Spring Cache 文章目录 Spring Cache1、Spring Cache介绍2、Spring Cache常用注解2.1、EnableCaching注解2.2、CachePut注解2.3、CacheEvict注解2.4、Cacheable注解 3、Spring Cache使用方式--redis 1、Spring Cache介绍 Spring Cache是一个框架,实现了基于注解的缓…

删除链表的中间节点

题目: 示例: 思路: 这个题类似于寻找链表中间的数字,slow和fast都指向head,slow走一步,fast走两步,也许你会有疑问,节点数的奇偶不考虑吗?while执行条件写成fast&&…

JVM——类加载与字节码技术—字节码指令

2.字节码指令 2.1 入门 jvm的解释器可以识别平台无关的字节码指令,解释为机器码执行。 2a b7 00 01 b1 this . init() return 准备了System.out对象,准备了参数“hello world”,准备了对象的方法println(String)V&#xff…

如何优化因为高亮造成的大文本(大字段)检索缓慢问题

首先还是说一下背景,工作中用到了 elasticsearch 的检索以及高亮展示,但是索引中的content字段是读取的大文本内容,所以后果就是索引的单个字段很大,造成单独检索请求的时候速度还可以,但是加入高亮之后检索请求的耗时…

Prometheus+Grafana+AlertManager监控Linux主机状态

文章目录 PrometheusGrafanaAlertManager监控平台搭建开始监控Grafana连接Prometheus数据源导入Grafana模板监控Linux主机状态 同系列文章 PrometheusGrafanaAlertManager监控平台搭建 Docker搭建并配置Prometheus Docker拉取并配置Grafana Docker安装并配置Node-Exporter …