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

前端知识点---Javascript中检测数据类型函数总结

文章目录

  • 01 typeof 运算符
  • 02 instanceof 运算符
  • 03 Array.isArray()
  • 04 Object.prototype.toString.call()
  • 05 constructor 属性
  • 06 isNaN() 和 Number.isNaN() (常用)
  • 07 isFinite() 和 Number.isFinite()
  • 08 typeof null 是 "object" 的问题

01 typeof 运算符

返回值是一个字符串
全部类型都是可以检测的

typeof 42;            // "number"
typeof "hello";       // "string"
typeof true;          // "boolean"
typeof undefined;     // "undefined"
typeof null;          // "object" (这是历史遗留问题)
typeof Symbol();      // "symbol"
typeof BigInt(123);   // "bigint"
typeof {};            // "object"
typeof [];            // "object"
typeof function(){};  // "function"

注意:无法区分 null 和普通对象,数组和普通对象都会返回 “object”。

02 instanceof 运算符

用于检测对象是否是构造函数
检测引用类型时非常有用(如数组、对象、自定义类等)。

[] instanceof Array; // true
{} instanceof Object; // true
new Date() instanceof Date; // true
function(){} instanceof Function; // true

适用场景:
检查对象的具体类型,尤其是用户定义的类或构造函数。

03 Array.isArray()

专门用于检查值是否是数组。
Array.isArray([]); // true
Array.isArray({}); // false
适用场景:
专门区分数组和其他对象。

04 Object.prototype.toString.call()

可以准确检测所有内置对象的类型,返回更具体的类型信息。

Object.prototype.toString.call(42); // “[object Number]”
Object.prototype.toString.call(“hello”); // “[object String]”
Object.prototype.toString.call(true); // “[object Boolean]”
Object.prototype.toString.call(null); // “[object Null]”
Object.prototype.toString.call(undefined); // “[object Undefined]”
Object.prototype.toString.call([]); // “[object Array]”
Object.prototype.toString.call({}); // “[object Object]”
Object.prototype.toString.call(function(){}); // “[object Function]”
Object.prototype.toString.call(new Date()); // “[object Date]”
Object.prototype.toString.call(/regex/); // “[object RegExp]”
Object.prototype.toString.call(new Map()); // “[object Map]”
Object.prototype.toString.call(new Set()); // “[object Set]”
Object.prototype.toString.call(new WeakMap()); // “[object WeakMap]”

适用场景:
适用于更精确的数据类型检查,尤其是区分类似类型(如数组与对象、正则与对象等)。

05 constructor 属性

通过 constructor 可以访问对象的构造函数,从而判断对象的类型。

(42).constructor === Number; // true
(“hello”).constructor === String; // true
(true).constructor === Boolean; // true
({}).constructor === Object; // true
([]).constructor === Array; // true
(function() {}).constructor === Function; // true

适用场景:
检查引用类型的具体构造函数。
注意:
可能被篡改或重写,因此不总是可靠。

06 isNaN() 和 Number.isNaN() (常用)

isNaN():判断值是否为 NaN(非数字值或计算失败返回 NaN 时)。
Number.isNaN():判断值是否严格为 NaN(类型安全)。

isNaN(“hello”); // true (被隐式转换后是NaN)
isNaN(NaN); // true

Number.isNaN(“hello”); // false
Number.isNaN(NaN); // true

07 isFinite() 和 Number.isFinite()

isFinite():检测值是否是有限数(可以自动转换类型)。
Number.isFinite():检测值是否是有限数,但不进行类型转换。

isFinite(42); // true
isFinite(“42”); // true (字符串被转换为数字)
isFinite(Infinity); // false
isFinite(NaN); // false

Number.isFinite(42); // true
Number.isFinite(“42”); // false (严格检测类型)

08 typeof null 是 “object” 的问题

由于历史原因,typeof null 返回 “object”,所以使用 typeof 检测时需要注意。

Object.prototype.toString.call(null) === “[object Null]”; // 更准确

总结
typeof 简单、快速检测基本类型 检查基础数据类型
instanceof 检查某对象是否为某类实例 检查引用类型和自定义类
Array.isArray() 专门检测数组 确认某变量是否是数组
Object.prototype.toString.call() 精确识别所有内置类型对象 高精度类型判断
constructor 查看对象的构造函数 检查引用类型构造器
isNaN / Number.isNaN 检测 NaN 判断是否为无效数字
isFinite / Number.isFinite 检测有限数字 检查是否有限数
每种方法都有自己的适用场景,根据需要选择合适的方法。

相关文章:

前端知识点---Javascript中检测数据类型函数总结

文章目录 01 typeof 运算符02 instanceof 运算符03 Array.isArray()04 Object.prototype.toString.call()05 constructor 属性06 isNaN() 和 Number.isNaN() (常用)07 isFinite() 和 Number.isFinite()08 typeof null 是 "object" 的问题 01 typeof 运算符 返回值是…...

aspose如何获取PPT放映页“切换”的“持续时间”值

aspose如何获取PPT放映页“切换”的“持续时间”值 项目场景问题描述问题1:从官方文档和资料查阅发现并没有对切换的持续时间进行处理的方法问题2:aspose的依赖包中,所有的关键对象都进行了混淆处理 解决方案1、找到ppt切换的持续时间对应的混…...

【MQTT】代理服务比较RabbitMQ、Mosquitto 和 EMQX

前言 目前要处理大量设备同时频繁发送数据的情况,MQTT协议确实是一个更优的选择,因为它特别适合需要低带宽和高效能的物联网应用,下面是对目前主流协议的对比 数据截止日期:2024年11月10日 基础设施 后端: springclo…...

【C#/C++】C++/CL中String^的含义和举例,C++层需要调用C#层对象时...

示例: String^ IDataServer::GetParam(String^ aParamName){ /// }在 C/CLI 中,String^ 和 IDataServer::GetParam(String^ aParamName) 这种写法是一种混合了 C 和 .NET 的语法,用于在 C 中操作 .NET 对象。C/CLI 是微软扩展的 C 语言&…...

Python学习从0到1 day26 第三阶段 Spark ② 数据计算Ⅰ

人总是会执着于失去的,而又不珍惜现在所拥有的 —— 24.11.9 一、map方法 PySpark的数据计算,都是基于RDD对象来进行的,采用依赖进行,RDD对象内置丰富的成员方法(算子) map算子 功能:map算子…...

【详细】如何优雅地删除 Docker 容器与镜像

内容预览 ≧∀≦ゞ 镜像与容器的区别删除容器和镜像的具体步骤1. 删除容器步骤 1:查看当前运行的容器步骤 2:停止容器步骤 3:删除容器 2. 删除镜像步骤 1:查看镜像列表步骤 2:删除镜像 3. 删除所有容器和镜像 使用 1Pa…...

Spring Spring Boot 常用注解总结

在 Java 开发中,Spring 和 Spring Boot 框架广泛应用于企业级应用开发。这两个框架提供了丰富的注解,使得开发更加高效和便捷。本文将对 Spring 和 Spring Boot 中常用的注解进行总结。 一、Spring 常用注解 1. Component 作用:用于将普通的…...

Flink独立集群+Flink整合yarn

Flink独立集群的搭建: 1、上传解压配置环境变量 # 1、解压 tar -xvf flink-1.15.4-bin-scala_2.12.tgz # 2、修改环境变量 export FLINK_HOME/usr/local/soft/flink-1.15.4 export PATH$PATH:$FLINK_HOME/bin 2、修改配置文件 cd /usr/local/soft/flink-1.15.4/…...

动态规划 之 简单多状态 dp 问题 算法专题

一. 按摩师 按摩师 状态表示 根据经验 题目要求 dp[i] 表示: 选择到i位置时, 此时的最长预约时长 但是根据题目又分成两种情况: f[i] : 选择到 i 位置的时候, nums[i] 必选, 此时的最长预约时长 g[i] : 选择到 i 位置的时候, nums[i] 不选, 此时的最长预约时长状态转移方程 …...

qt QPixmapCache详解

1、概述 QPixmapCache是Qt框架中提供的一个功能强大的图像缓存管理工具类。它允许开发者在全局范围内缓存QPixmap对象,从而有效减少图像的重复加载,提高图像加载和显示的效率。这对于需要频繁加载和显示图像的用户界面应用来说尤为重要,能够…...

Redis中的持久化

什么是 Redis 持久化? Redis 是一个内存数据库,也就是说它主要把数据存储在内存中,这样可以实现非常高的读写速度。通常,内存数据库是非常快速且高效的,但它也有一个很大的问题:数据丢失的风险。因为当 Red…...

Unity 如何优雅的限定文本长度, 包含对特殊字符,汉字,数字的处理。实际的案例包括 用户昵称

常规限定文本长度 ( 通过 UntiyEngine.UI.Inputfiled 附带的长度限定 ) 痛点1 无法对中文,数字,英文进行识别,同样数量的汉字和同样数量的英文像素长度是不一样的,当我们限定固定长度后,在界面上的排版不够美观 痛点2…...

SMO+PLL滑膜观测器、MARS模型参考自适应观测器simulink仿真

模型内容介绍: (1)SMOPLL滑膜观测器通过SMO估计电机的转速和位置信息,并利用PLL技术对这些信息进行跟踪和校正,以实现高精度的电机控制; (2)MARS是一种基于模型参考自适应控制理论…...

例题解析:利用异或运算(XOR)找出单独的数

异或运算(XOR) 异或运算是一种位运算,通常用符号 ^ 表示。它的运算规则如下: 如果两个二进制位相同,结果为 0。如果两个二进制位不同,结果为 1。 具体来说,对于两个二进制位 a 和 b&#xff…...

如何处理微信小程序大量未捕获的异常

1)如何处理微信小程序大量未捕获的异常 2)如何关闭代码创建的纹理的读写,或者创建不带读写的图片 3)回收带有贴图和Collider的Mesh,如何正确用对象池维护 4)Cloth组件使用在一个篮筐上,运行后篮…...

C#-StringBuilder

string:特殊的引用 每次重新赋值或者拼接时会分配新的内存空间,如果一个字符串经常改变会非常浪费空间。 StringBuilder:C#提供的一个用于处理字符串的公共类 修改字符串而不创建新的对象,需要频繁修改和拼接的字符串可以使用它…...

SQLI LABS | Less-39 GET-Stacked Query Injection-Intiger Based

关注这个靶场的其它相关笔记:SQLI LABS —— 靶场笔记合集-CSDN博客 0x01:过关流程 输入下面的链接进入靶场(如果你的地址和我不一样,按照你本地的环境来): http://localhost/sqli-labs/Less-39/ 本关是堆…...

linux安装zookeeper和kafka集群

linux安装zookeeper和kafka集群 一、Zookeeper集群部署安装zookeeper1. 下载2. 上传, 解压3. 配置 Zookeeper 节点4. 创建 myid 文件5. 启动参数更改6. sh文件授权7. 启动集群8. 防火墙开启端口 验证集群 二、kafka集群安装安装Kafka1. 下载Kafka安装包2. 上传到服务器&#xf…...

洞悉 Linux 系统运行细节,使用 atop 监测和回看系统负载状态

Linux系统的资源使用情况,你可以通过使用命令如free、top和netstat来实时监控内存、CPU及端口的使用状态。对于需要追踪历史资源消耗动态的场景,atop命令则能有效帮助用户查看过去的系统负载情况。 本篇教程的灵感源自一位小伙伴的真实经历:…...

“双十一”电商狂欢进行时,在AI的加持下看网易云信IM、RTC如何助力商家!

作为一年一度的消费盛会,2024年“双十一”购物狂欢节早已拉开帷幕。蹲守直播间、在主播热情介绍中点开链接并加购,也已成为大多数人打开“双11”的重要方式。然而,在这火热的购物氛围背后,主播频频“翻车”、优质主播稀缺、客服响…...

SpringBoot-17-MyBatis动态SQL标签之常用标签

文章目录 1 代码1.1 实体User.java1.2 接口UserMapper.java1.3 映射UserMapper.xml1.3.1 标签if1.3.2 标签if和where1.3.3 标签choose和when和otherwise1.4 UserController.java2 常用动态SQL标签2.1 标签set2.1.1 UserMapper.java2.1.2 UserMapper.xml2.1.3 UserController.ja…...

Vue记事本应用实现教程

文章目录 1. 项目介绍2. 开发环境准备3. 设计应用界面4. 创建Vue实例和数据模型5. 实现记事本功能5.1 添加新记事项5.2 删除记事项5.3 清空所有记事 6. 添加样式7. 功能扩展:显示创建时间8. 功能扩展:记事项搜索9. 完整代码10. Vue知识点解析10.1 数据绑…...

mongodb源码分析session执行handleRequest命令find过程

mongo/transport/service_state_machine.cpp已经分析startSession创建ASIOSession过程,并且验证connection是否超过限制ASIOSession和connection是循环接受客户端命令,把数据流转换成Message,状态转变流程是:State::Created 》 St…...

ServerTrust 并非唯一

NSURLAuthenticationMethodServerTrust 只是 authenticationMethod 的冰山一角 要理解 NSURLAuthenticationMethodServerTrust, 首先要明白它只是 authenticationMethod 的选项之一, 并非唯一 1 先厘清概念 点说明authenticationMethodURLAuthenticationChallenge.protectionS…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开,首…...

python执行测试用例,allure报乱码且未成功生成报告

allure执行测试用例时显示乱码:‘allure’ �����ڲ����ⲿ���Ҳ���ǿ�&am…...

让回归模型不再被异常值“带跑偏“,MSE和Cauchy损失函数在噪声数据环境下的实战对比

在机器学习的回归分析中,损失函数的选择对模型性能具有决定性影响。均方误差(MSE)作为经典的损失函数,在处理干净数据时表现优异,但在面对包含异常值的噪声数据时,其对大误差的二次惩罚机制往往导致模型参数…...

Java毕业设计:WML信息查询与后端信息发布系统开发

JAVAWML信息查询与后端信息发布系统实现 一、系统概述 本系统基于Java和WML(无线标记语言)技术开发,实现了移动设备上的信息查询与后端信息发布功能。系统采用B/S架构,服务器端使用Java Servlet处理请求,数据库采用MySQL存储信息&#xff0…...

力扣热题100 k个一组反转链表题解

题目: 代码: func reverseKGroup(head *ListNode, k int) *ListNode {cur : headfor i : 0; i < k; i {if cur nil {return head}cur cur.Next}newHead : reverse(head, cur)head.Next reverseKGroup(cur, k)return newHead }func reverse(start, end *ListNode) *ListN…...

根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的----NTFS源代码分析--重要

根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的 第一部分&#xff1a; 0: kd> g Breakpoint 9 hit Ntfs!ReadIndexBuffer: f7173886 55 push ebp 0: kd> kc # 00 Ntfs!ReadIndexBuffer 01 Ntfs!FindFirstIndexEntry 02 Ntfs!NtfsUpda…...