JS数据类型检测方法总结

在 JavaScript 中,数据类型检测是开发中的常见需求。以下是主要检测方法及其优缺点:

1. typeof 操作符

最基础的检测方式,返回类型字符串:

typeof 42;           // "number"
typeof "hello";      // "string"
typeof true;         // "boolean"
typeof undefined;    // "undefined"
typeof function() {}; // "function"
typeof Symbol();     // "symbol"
typeof {};           // "object"
typeof [];           // "object" (注意!)
typeof null;         // "object" (历史遗留问题)

缺点:

  • 无法区分数组、对象、null(都返回 “object”)

2. instanceof 操作符

检测对象是否属于某个构造函数的实例:

[] instanceof Array;      // true
{} instanceof Object;     // true
new Date() instanceof Date; // truefunction Person() {}
const p = new Person();
p instanceof Person;      // true

缺点:

  • 不适用于原始值类型(数字、字符串等)
  • 多窗口/iframe 环境下失效(不同全局环境)

3. Object.prototype.toString.call()

最可靠的检测方法,返回 [object Type] 格式:

Object.prototype.toString.call(42);        // "[object Number]"
Object.prototype.toString.call("hello");   // "[object String]"
Object.prototype.toString.call([]);        // "[object Array]"
Object.prototype.toString.call(null);      // "[object Null]"
Object.prototype.toString.call(undefined); // "[object Undefined]"
Object.prototype.toString.call(/regex/);   // "[object RegExp]"

封装工具函数:

function getType(obj) {return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}getType([]); // "array"
getType(null); // "null"

4. 特殊类型检测

  • 数组检测:
Array.isArray([]); // true (ES5+ 最佳方案)
// 旧浏览器兼容方案:
Object.prototype.toString.call([]) === "[object Array]";
  • NaN 检测:
isNaN(NaN); // true (注意: isNaN("abc") 也返回 true)
Number.isNaN(NaN); // true (ES6 推荐,严格检测)
  • null/undefined 检测:
let foo = null;
foo === null; // true (精确检测 null)
typeof bar === "undefined"; // 检测未定义

终极解决方案

结合多种方式实现全类型检测:

function detectType(value) {// 处理 null 和 undefinedif (value === null) return "null";if (value === undefined) return "undefined";// 处理其他类型const type = typeof value;if (type !== "object") return type; // 原始类型直接返回// 对象类型细化return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
}// 测试
detectType([]); // "array"
detectType(new Map()); // "map"
detectType(Symbol()); // "symbol"
detectType(42); // "number"

总结对比

方法优点缺点
typeof简单快速,适合原始类型无法区分数组/对象/null
instanceof检测自定义对象不适用原始类型,多窗口环境失效
Object.prototype.toString精准识别所有类型(推荐)语法稍复杂
Array.isArray()数组检测最优解仅适用于数组

最佳实践:

  • 基础类型检测 → typeof
  • 数组检测 → Array.isArray()
  • 完整类型检测 → Object.prototype.toString.call()
  • null 检测 → value === null

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

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

相关文章

AEO:从搜索引擎到答案引擎,AI时代搜索优化的新战场

在 ChatGPT、DeepSeek、Google SGE 等生成式AI崛起的时代,搜索正在经历一场根本性变革: 过去:搜索引擎优化(SEO) 现在:答案引擎优化(AEO) 当搜索结果开始由AI直接生成“答案”而非…

搭建Node.js服务器

1.基础HTTP服务器: 添加了路由处理添加了404错误处理添加了服务器错误监听 2.静态资源服务器: 使用异步文件操作支持目录自动索引(默认加载 index.html)自动检测文件类型并设置正确Content-Type更完善的错误处理 3.处理GET请求参数 提供了一个HTML表单用于测试使用url模块…

Linux grep 命令

grep 是 Linux/Unix 系统中用于文本搜索的强大工具,支持基于正则表达式的模式匹配。以下是其详细用法及实际应用示例: 基本语法 grep [选项] 模式 [文件...]模式:要搜索的字符串或正则表达式。文件:可以是单个文件或多个文件&…

oracle 11g通过rman做备份和还原

ORACLE RMAN增量备份完整恢复测试 1.创建测试环境: 1.1.创建测试表空间 SQL> create tablespace tablespace1 datafile ‘/data/u01/app/oracle/oradata/orcl/tablespace1.dbf’ size 10m; SQL> 1.2.创建测试用户并指定为默认表空间: SQL> create user user1 iden…

为什么TCP有粘包问题,而UDP没有

TCP粘包问题源于其面向字节流的设计,而UDP无此问题因其基于数据报的传输机制。 🔍 一、TCP粘包问题的原因 字节流传输特性 TCP将数据视为连续的字节流,而非独立的消息包。发送端多次写入的小数据可能被合并为一个TCP段发送;接收端…

ELM:Embodied Understanding of Driving Scenarios

1. ELM 的创新点与核心思路 ELM 的核心在于 “具身理解”(Embodied Understanding),即通过常识与环境交互并进行推理,这一理念适用于自动驾驶车辆、机器人和无人机等多种应用场景。具身智能体(Embodied Agent)需具备四大核心能力:首先,它能够描述周围环境,对交通物体的…

实景VR知识科普

实景VR的定义与技术特点 实景VR,即基于真实场景的虚拟现实技术,是通过计算机生成的三维环境,旨在模拟并再现真实世界场景。用户佩戴VR设备(如VR头盔、手柄等)后,能够沉浸在一个高度仿真的虚拟环境中&#…

CppCon 2016 学习:ITERATOR HAIKU

这组幻灯片讲解了 C 中**范围(Ranges)和迭代器(Iterators)**的核心概念,特别是 C14 标准定义的五种迭代器类别,以及范围的基本使用方式。我帮你理个思路: 1. RANGE-SEQUENCE: 元素范围&#xf…

开源飞控fmt软件在环仿真环境搭建

tags: 飞控 fmt开发环境搭建 fmt是国产开源飞控,特点是支持基于模型设计(基于simulink仿真),源码结构目录较清晰,项目体积较小。 此项目操作系统选择的是国产实时操作系统rt-thread,也是开源项目。&#…

如何通过AI测试平台实现自动化缺陷检测和优化

在数字化转型加速的今天,软件质量保证已成为企业竞争力的关键要素之一。传统的手工测试方法面临着效率低下、成本高昂和覆盖面有限等挑战,而AI技术的融入为软件测试领域带来了革命性的变化。本文将深入探讨如何构建一个完整的AI测试平台,实现…

使用JeecgBoot配置

Jeecg 使用方法 本文以在环境配置好的前提下进行讲解 如果不会配置环境 可在billbill网站的Jeecg官网搜索环境配置 第一步 打开redis,redis是一个服务,需要用命令行打开 且命令行不能关 不能实现一劳永逸效果 每次关闭都得重新打开一次。 第二步 启动j…

NodeJS:版本及对应时间并对应的npm版本

versionltsrelease dateenginenpmnode下载更新日志文档Node.js 24.0.1✅2025-05-0813.61--下载更新日志文档Node.js 22.12.0✅2024-12-03---下载更新日志文档Node.js 21.2.0 2023-11-1411.8.172.1710.2.3120下载更新日志文档Node.js 20.10.0✅2023-11-2211.3.244.810.2.3115下载…

UI前端大数据处理:应对海量数据的挑战与策略

hello宝子们...我们是艾斯视觉擅长ui设计、前端开发、数字孪生、大数据、三维建模、三维动画10年经验!希望我的分享能帮助到您!如需帮助可以评论关注私信我们一起探讨!致敬感谢感恩! 在数字化转型的深水区,全球每日产生的数据量已突破 500EB,相当于 10 亿…

对微服务的了解

微服务是一种架构风格,我们可以把应用程序划分为一组小型的、松散耦合的服务, 每个服务都运行在自己的进程中,并通过轻量级的通信机制进行通信, 每个服务都是独立部署、独立扩展、独立更新的,从而提高了应用程序的可伸…

计算机视觉生物启发视觉算法:如何模拟人眼与大脑?

计算机视觉生物启发视觉算法:如何模拟人眼与大脑? 一、前言二、人眼与大脑视觉系统基础概念​2.1 人眼的生理结构与功能​2.2 大脑视觉皮层的信息处理机制​三、生物启发视觉算法的核心技术​3.1 视网膜启发的特征提取算法​3.2 视觉皮层启发的分层特征学习算法​3.3 注意力机…

stm32使用定时器功能之高精度定时(微秒级)、输入捕获以及超声波测距

一、定时器功能之高精度定时(微秒级) 我们常用的延时函数中无论是HAL_Delay还是vTaskDelay()函数都是毫秒级的定时,我们可以借助定时器实现一个微秒级更高精度的延时函数。这个定时器不会影响FreeRtos的任务切换 这里就是用定时器的计数功能…

Git常用命令摘要

写这篇博文的目的只是简单的给自己及团队的日常工作中需要用到的git命令作个汇总,这样平时只需要查阅这篇文章就够了,不用到处查找。如果能给有需要的朋友一点点的帮助,那也算是意外之喜吧。 一、基础配置 # 设置用户名和邮箱(首…

ubuntu 22.04 安装部署kibana 7.10.0详细教程

安装部署kibana 7.10.0详细教程 下载并安装二、修改kibana.yml文件三、性能配置四、启动服务验证五、安装启动常见问题 【背景】 整个elk安装是基于ubuntu 22.04和jdk 11环境。kibana均采用 *.deb方式安装,需要服务器能联网。ubuntu 22.04 安装部署elk(elasticsearc…

nfs 服务器的搭建

nfs 服务器的搭建 1.配置yum源 mkdir /etc/yum.repos.d/bak mv /etc/yum.repo.d/*.repo /etc/yum.repos.d/bak/ curl -o /etc/yum.repos.d/centos.repo http://10.26.210.101/centos/centos.repo # 外网 curl -o /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.c…

Yii2 基础版实现 Token 认证 API 服务的完整框架方案

以下是一个基于 Yii2 基础版实现 Token 认证 API 服务的完整框架方案,包含 JWT 实现和完整代码: 1. 环境准备 composer create-project --prefer-dist yiisoft/yii2-app-basic yii2-api cd yii2-api2. 安装必要扩展 composer require firebase/php-jw…