前端知识点---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ÿ…...

如何处理微信小程序大量未捕获的异常
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. 上传到服务器…...

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

“双十一”电商狂欢进行时,在AI的加持下看网易云信IM、RTC如何助力商家!
作为一年一度的消费盛会,2024年“双十一”购物狂欢节早已拉开帷幕。蹲守直播间、在主播热情介绍中点开链接并加购,也已成为大多数人打开“双11”的重要方式。然而,在这火热的购物氛围背后,主播频频“翻车”、优质主播稀缺、客服响…...

国防科技大学计算机基础课程笔记02信息编码
1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...

docker详细操作--未完待续
docker介绍 docker官网: Docker:加速容器应用程序开发 harbor官网:Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台,用于将应用程序及其依赖项(如库、运行时环…...
基于数字孪生的水厂可视化平台建设:架构与实践
分享大纲: 1、数字孪生水厂可视化平台建设背景 2、数字孪生水厂可视化平台建设架构 3、数字孪生水厂可视化平台建设成效 近几年,数字孪生水厂的建设开展的如火如荼。作为提升水厂管理效率、优化资源的调度手段,基于数字孪生的水厂可视化平台的…...

Keil 中设置 STM32 Flash 和 RAM 地址详解
文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面(Target 选项卡)1. IROM1(用于配置 Flash)2. IRAM1(用于配置 RAM)二、链接器设置界面(Linker 选项卡)1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数(如果没有勾选上面…...
Web 架构之 CDN 加速原理与落地实践
文章目录 一、思维导图二、正文内容(一)CDN 基础概念1. 定义2. 组成部分 (二)CDN 加速原理1. 请求路由2. 内容缓存3. 内容更新 (三)CDN 落地实践1. 选择 CDN 服务商2. 配置 CDN3. 集成到 Web 架构 …...

浪潮交换机配置track检测实现高速公路收费网络主备切换NQA
浪潮交换机track配置 项目背景高速网络拓扑网络情况分析通信线路收费网络路由 收费汇聚交换机相应配置收费汇聚track配置 项目背景 在实施省内一条高速公路时遇到的需求,本次涉及的主要是收费汇聚交换机的配置,浪潮网络设备在高速项目很少,通…...

GruntJS-前端自动化任务运行器从入门到实战
Grunt 完全指南:从入门到实战 一、Grunt 是什么? Grunt是一个基于 Node.js 的前端自动化任务运行器,主要用于自动化执行项目开发中重复性高的任务,例如文件压缩、代码编译、语法检查、单元测试、文件合并等。通过配置简洁的任务…...

代码规范和架构【立芯理论一】(2025.06.08)
1、代码规范的目标 代码简洁精炼、美观,可持续性好高效率高复用,可移植性好高内聚,低耦合没有冗余规范性,代码有规可循,可以看出自己当时的思考过程特殊排版,特殊语法,特殊指令,必须…...
LangFlow技术架构分析
🔧 LangFlow 的可视化技术栈 前端节点编辑器 底层框架:基于 (一个现代化的 React 节点绘图库) 功能: 拖拽式构建 LangGraph 状态机 实时连线定义节点依赖关系 可视化调试循环和分支逻辑 与 LangGraph 的深…...
WEB3全栈开发——面试专业技能点P7前端与链上集成
一、Next.js技术栈 ✅ 概念介绍 Next.js 是一个基于 React 的 服务端渲染(SSR)与静态网站生成(SSG) 框架,由 Vercel 开发。它简化了构建生产级 React 应用的过程,并内置了很多特性: ✅ 文件系…...