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

news2024/11/18 9:20:32

相信很多小伙伴在使用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

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

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

相关文章

ssm+vue游戏攻略网站源码和论文

ssmvue游戏攻略网站源码和论文052 开发工具:idea 数据库mysql5.7 数据库链接工具:navcat,小海豚等 技术:ssm 一、主要内容和基本要求 游戏攻略网站分为管理员与用户两种角色。 管理员的功能包括登录,用户管理,游…

Laravel 框架构造器的查询表达式构造器的 Where 派生查询 ⑥

作者 : SYFStrive 博客首页 : HomePage 📜: THINK PHP 📌:个人社区(欢迎大佬们加入) 👉:社区链接🔗 📌:觉得文章不错可以点点关注 &#x1f44…

QCC_BES 音频重采样算法实现

+V hezkz17进数字音频系统研究开发交流答疑群(课题组) 这段代码是一个用于将音频数据进行立体声重采样的函数。以下是对代码的解读: 函数接受以下参数: pcm_buf:16位有符号整型的音频缓冲区,存储了输入的音频数据。pcm_len:音频缓冲区的长度。mic1:16位有符号整型的音频…

SpringBoot 01 如何创建 和pom的解析

目录 1 Springboot的创建 步骤 2 项目的书写和运行 创建service包并在其下写一个service文件 项目的运行 pom文件的一些配置 parent web test 打包 打包过程 1 Springboot的创建 步骤 首先new一个新项目 然后依照如下创建 2 项目的书写和运行 创建service包并…

企业网络日志安全与 EventLog Analyzer

企业的网络日志安全是一项至关重要的任务。随着信息技术的迅猛发展,网络攻击和数据泄露的威胁也与日俱增。为了应对这些威胁,企业需要强大的工具来监控、分析和保护其网络日志。而ManageEngine的EventLog Analyzer正是这样一款卓越的解决方案。 网络日志…

意外发现Cortex-M内核带的64bit时间戳,比32bit的DWT时钟周期计数器更方便,再也不用担心溢出问题了

视频: https://www.bilibili.com/video/BV1Bw411D7F5 意外发现Cortex-M内核带的64bit时间戳,比32bit的DWT时钟周期计数器更方便,再也不用担心溢出问题了 介绍: 看参数手册的Debug章节,System ROM Table里面带Timestam…

PS基础操作

1:盖印图层。 1. 建立新图层:盖印前要先新建一透明层,或者添加调整图层和中性色图层。 2. 按快捷键Ctrl Alt Shift E盖印所有可见图层;Ctrl Alt E盖印所选图层 2:复制图层。 复制图层CtrlJ 3:shift…

读SQL学习指南(第3版)笔记04_查询入门

1. 在执行语句之前,会先检查下列事项 1.1. 是否有权限执行该语句 1.2. 是否有权限访问指定的数据 1.3. 语句的语法是否正确 2. select子句 2.1. select子句是select语句中的第一个子句,但最后才会被数据库服务器评估 2.2. 决定哪些列应该包含在查询…

stm32之15.超声波与灯光功能一起实现(进阶)

主函数代码修改 --------------------- 源码 int main(void) {uint32_t t0;uint32_t distance;NVIC_PriorityGroupConfig(NVIC_PriorityGroup_4);led_init();key_init();/* 初始化串口1波特率为115200bps,若发送/接收数据有乱码,请检查PLL */usart1_ini…

vue 使用C-Lodop打印小票

先从官网下载js文件 https://www.lodop.net/LodopDemo.html 打开安装程序,一直下一步既可,我这边已经安装过就不演示了。 // 引入 import { getLodop } from /utils/CLodopfuncs.js;// 使用 let LODOP getLodop()let Count LODOP.GET_PRINTER_COUNT…

嵌入式ARM 音频算法开发库

我V hezkz17进数字音频系统研究开发交流答疑群(课题组) CMSIS DSP Library 算法库,是开源的算法库 BES的SDK也使用了该库,要想自己设计嵌入式音频算法,可在Cortex-M内核平台可以基于此库开发算法 AEC, AGC, ANC, ENC, RNC, 。。。。。。…

Ansible 创建使用角色

使用 Ansible Galaxy 和要求文件 /ansible/roles/requirements.yml 。从以下 URL 下载角色并安装到 /ansible/roles : http://materials/haproxy.tar 此角色的名称应当为 balancer http://materials/phpinfo.tar 此角色的名称应当为 phpinfo #创建 vim /ansible/r…

四、Kafka Broker

4.1.1 Zookeeper 存储的 Kafka 信息 4.1.2 Kafka Broker 总体工作流程 4.2 生产经验 - 节点的服役和退役 自己的理解:其实就是将kafka的分区,负载到集群中的各个节点上。 1、服役新节点 2、退役旧节点 4.3 kafka副本

商城-学习整理-集群-K8S(二十三)

目录 一、k8s 集群部署1、k8s 快速入门1)、简介2)、架构1、整体主从方式2、Master 节点架构3、Node 节点架构 3)、概念4)、快速体验1、安装 minikube2、体验 nginx 部署升级 5)、流程叙述 2、k8s 集群安装1、kubeadm2、…

【学习FreeRTOS】第14章——FreeRTOS信号量

1.信号量的简介 信号量是一种解决同步问题的机制,可以实现对共享资源的有序访问。 信号量:用于传递状态(区别于队列传递消息) 信号量的计数值都有限制:限定最大值。 如果最大值被限定为1,那么它就是二值…

Kaggle回归问题Mercedes——Benz Greener Manufacturing

目录 前言1 题目介绍2 数据清洗3 数据可视化分析4 模型训练5 源码 前言 这是我在大三选修课的课程设计,内容参考了Kaggle上高赞的代码,有详细批注,整体比较基础,结构相对完整,便于初学者学习。这个是一个回归问题&…

BLE ch582 广播数据格式

BLE 蓝牙数据广播格式{6个字节(蓝牙设备MAC 地址)AD structure…AD structure N } 37字节 AD structure 长度类型内容 修改被扫描状态(被发现状态)的name:take 被扫描状态的name: take 链接后的状态变成;变成广播态;name: BLE…

Go 语言的实战案例 | 青训营

Powered by:NEFU AB-IN 文章目录 Go 语言的实战案例 | 青训营 Go补充简介猜数游戏在线词典项目 Go 语言的实战案例 | 青训营 GO语言工程实践课后作业:实现思路、代码以及路径记录 Go补充简介 在计算机编程领域,Go 语言(也称为 Golang&…

二叉树---前,中,后序遍历做题技巧(前,中,后,层次,线索二叉树)

1.由二叉树求前,中,后序遍历 前序:根左右(每一个小方块都遵循) 得到:A,B,D,H,E,I,C,F,G 中序:左根右(每一个小方块都遵循) 得到:H,D,B,I,E,A,F,C,G 后序:左右…

js 模块 简单实验

1.代码 1.1 t2.js var year "test"; export { year }; 1.2 t1.js import { year } from ./t2.jsalert(year); 1.3 t.html <script type"module" src"./t1.js"></script> 2.运行结果