JavaScript数据类型判断之Object.prototype.toString.call() 的详解

Object.prototype.toString.call() 的详解

Object.prototype.toString.call() 是 JavaScript 中判断数据类型的强大方法。它可以精确区分所有的 JavaScript 内置类型,包括原始类型和对象类型。


语法

Object.prototype.toString.call(value)
  • value 是要检测类型的变量。
  • 返回结果是一个类似 "[object Type]" 的字符串,其中 Type 是该变量的类型名称。

为什么使用它?

  • 准确性:它可以区分 nullundefined,以及各种内置对象(如 ArrayDate 等)。
  • 通用性:不依赖环境或原型链,可以用于跨环境的类型判断。

返回值

以下是常见数据类型及其对应的返回值:

数据类型返回值
Number[object Number]
String[object String]
Boolean[object Boolean]
Undefined[object Undefined]
Null[object Null]
Array[object Array]
Object[object Object]
Function[object Function]
Date[object Date]
RegExp[object RegExp]
Error[object Error]
Symbol[object Symbol]
Map[object Map]
Set[object Set]
WeakMap[object WeakMap]
WeakSet[object WeakSet]
BigInt[object BigInt]
自定义类实例[object Object]

示例

// 基本类型
console.log(Object.prototype.toString.call(123)); // [object Number]
console.log(Object.prototype.toString.call("hello")); // [object String]
console.log(Object.prototype.toString.call(true)); // [object Boolean]
console.log(Object.prototype.toString.call(undefined)); // [object Undefined]
console.log(Object.prototype.toString.call(null)); // [object Null]// 对象类型
console.log(Object.prototype.toString.call([])); // [object Array]
console.log(Object.prototype.toString.call({})); // [object Object]
console.log(Object.prototype.toString.call(function() {})); // [object Function]
console.log(Object.prototype.toString.call(new Date())); // [object Date]
console.log(Object.prototype.toString.call(/abc/)); // [object RegExp]// 特殊对象
console.log(Object.prototype.toString.call(new Map())); // [object Map]
console.log(Object.prototype.toString.call(new Set())); // [object Set]
console.log(Object.prototype.toString.call(Symbol())); // [object Symbol]
console.log(Object.prototype.toString.call(BigInt(123))); // [object BigInt]

适用场景

  1. 区分 nullobject

    console.log(typeof null); // "object" (误导性结果)
    console.log(Object.prototype.toString.call(null)); // [object Null]
    
  2. 区分对象类型

    console.log(Object.prototype.toString.call([])); // [object Array]
    console.log(Object.prototype.toString.call({})); // [object Object]
    
  3. 跨环境检测
    在不同的 JavaScript 环境中(如浏览器和 Node.js),使用 instanceof 有时可能会失败,而 Object.prototype.toString.call() 是可靠的。


封装为通用函数

可以封装为一个类型检测工具:

function getType(value) {return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
}console.log(getType(123)); // "number"
console.log(getType(null)); // "null"
console.log(getType([])); // "array"
console.log(getType(new Map())); // "map"
console.log(getType(() => {})); // "function"

注意事项

  • 自定义类实例(非内置对象)都会返回 [object Object],如果需要区分,可以结合 constructor.name

    class MyClass {}
    const instance = new MyClass();
    console.log(Object.prototype.toString.call(instance)); // [object Object]
    console.log(instance.constructor.name); // MyClass
    
  • 无法检测用户定义的 Symbol.toStringTag 修改:

    const obj = { [Symbol.toStringTag]: "CustomTag" };
    console.log(Object.prototype.toString.call(obj)); // [object CustomTag]
    

Object.prototype.toString.call() 是一种强大的数据类型判断方法,特别适用于复杂类型判断。

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

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

相关文章

二次封装的天气时间日历选择组件

这个接口没调通 没有数据展示~ userStore.badgeDate是VUEX全部存的日历数据 <template><!-- 日历组件 --><el-date-pickerref"elPicker":size"size"v-model"dateTimeValue":type"dateType":range-separator"rang…

当你项目服务器磁盘报警

当你们公司运维收到这样的邮件&#xff0c;大概率日志文件过大引起的 在Linux下如何不停止服务,清空nohup.out文件呢&#xff1f; nohup.out会一直一直自己增长下去&#xff0c;如果你的服务器硬盘不给力的话&#xff0c;很容易把应用也挂掉&#xff08;硬盘没空间 &#xff0…

如何理解 TypeScript 中命名空间与模块?两者都有那些区别?如何更好的应用?

在 TypeScript 中&#xff0c;命名空间&#xff08;Namespace&#xff09;和模块&#xff08;Module&#xff09;是两种不同的代码组织方式&#xff0c;用于组织和管理代码结构&#xff0c;避免命名冲突和提高可维护性。虽然它们都可以将代码划分为不同的逻辑单元&#xff0c;但…

基于Qwen-Agent框架的Function Call及ReAct方式调用自定义工具

本文主要基于ollama加载的qwen2.5模型以及Qwen-Agent框架,实现对工具的自主定义和准确调用。调用方式上尝试了Function Call及ReAct这两种大的方向,并探索了流式与非流式生成方式、串行与并行的函数调用、以及中英语言的提示词模版的效果比较。 文章目录 准备工作工具定义模型…

低速接口项目之串口Uart开发(四)——UART串口实现FPGA内部AXILITE寄存器的读写控制

本节目录 一、设计背景 二、设计思路 三、逻辑设计框架 四、仿真验证 五、上板验证 六、往期文章链接本节内容 一、设计背景 通常&#xff0c;芯片手册或者IP都会提供一系列的用户寄存器以及相关的定义&#xff0c;用于软件开发人员进行控制底层硬件来调试&#xff0c;或封装…

git branch -d 删除分支

Git进行版本控制时&#xff0c;删除分支是常见的操作。特别是当特定的功能开发完成或者分支不再需要时&#xff0c;删除分支可以帮助保持仓库的整洁。删除本地分支和删除远端分支是两个独立的操作。如果需要同时删除本地和远端的分支&#xff0c;需要分别执行以下两个命令。 一…

Linux环境开启MongoDB的安全认证

文章目录 1. MongoDB安全认证简介1.1 访问控制1.2 角色1.3 权限 2. MongoDB中的常见角色3. MongoDB Shell3.1 下载MongoDB Shell3.2 通过MongoDB Shell连接MongoDB 4. 创建管理员用户5. 为具体的数据库创建用户6. 开启权限认证7. 重启MongoDB服务8. 连接MongoDB9. MongoDB数据库…

Flutter封装Coap

前言 我们根据Coap数据通信流程写一个公共组件&#xff0c;用户只要在原本的组件外嵌套这个公共组件就可以使用Coap的功能&#xff0c;这样做更加的方便便捷。 具体步骤 封装一个udp函数 创建一个工厂函数&#xff0c;工厂函数初始化时监听广播数据发送广播函数&#xff1a…

探索 Vue.js:构建交互式前端的强大工具

在当今的 web 开发领域&#xff0c;前端技术日新月异&#xff0c;而 Vue.js 作为一款备受瞩目的 JavaScript 框架&#xff0c;以其简洁易用、高效灵活的特点&#xff0c;赢得了众多开发者的青睐。今天&#xff0c;就让我们深入了解一下 Vue.js 的相关知识&#xff0c;同时也探讨…

Java方法中的可变参数列表

在Java中&#xff0c;可变参数列表&#xff08;Variable Argument List&#xff09;允许方法接受不定数量的参数。可变参数列表通过在方法参数类型后加上三个点&#xff08;...&#xff09;来定义。可变参数列表实际上是一个数组&#xff0c;因此可以在方法内部像操作数组一样操…

PVE的优化与温度监控(二)—无法识别移动硬盘S.M.A.R.T信息的思考并解决

前情提要&#xff1a;空闲2.5英寸机械硬盘&#xff0c;直接放到PVE上测试NAS 使用&#xff0c;通过SATA线的方式让小主机不太美观&#xff0c;并且失去了前期调试的安全性。购入移动硬盘盒&#xff0c;缺点&#xff0c;USB 连接&#xff0c;会失去一些特性。比如本文中遇到的问…

嵌入式硬件实战基础篇(二)-稳定输出3.3V的太阳能电池-无限充放电

引言&#xff1a;本内容主要用作于学习巩固嵌入式硬件内容知识&#xff0c;用于想提升下述能力&#xff0c;针对学习稳压芯片和电容以及电池之间的运用&#xff0c;对于硬件PCB以及原理图的练习和前面硬件篇的实际运用&#xff1b;太阳能是一种清洁、可再生的能源&#xff0c;广…

Word和Excel使用有感

1.画图 折线图&#xff1a;适用于多个y值的画图 散点图&#xff1a;适合需要对x轴进行自定义时使用 2.word和excel的联动 1&#xff09;excel中的数据导入word直接复制即可 若是表格中的数据要导入word 则先将表格中的数据拆分出来&#xff0c;再直接复制到word中 2&#…

OpenCV相机标定与3D重建(3)校正鱼眼镜头畸变的函数calibrate()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 cv::fisheye::calibrate 函数是 OpenCV 中用于校正鱼眼镜头畸变的一个重要函数。该函数通过一系列棋盘格标定板的图像来计算相机的内参矩阵和畸变…

【过程控制系统】第6章 串级控制系统

目录 6. l 串级控制系统的概念 6.1.2 串级控制系统的组成 6.l.3 串级控制系统的工作过程 6.2 串级控制系统的分析 6.2.1 增强系统的抗干扰能力 6.2.2 改善对象的动态特性 6.2.3 对负荷变化有一定的自适应能力 6.3 串级控制系统的设计 6.3.1 副回路的选择 2.串级系…

24/11/22 项目拆解 艺术风格转移

我们有时候想把两种艺术风格整合&#xff0c;创造更具艺术特色的艺术品&#xff0c;人很难办到&#xff0c;但是人工智能可以,比如下面将艺术画的风格转移到照片上。 我们先来初步了解一下实现上述功能的数学原理 所谓艺术风格&#xff0c;其实就是边缘&#xff0c;颜色&#…

中断的详细流程

一、中断请求 中断请求是中断过程的起始阶段&#xff0c;由需要CPU服务的外设&#xff08;中断源&#xff09;向CPU发出请求信号。这个信号可以是电平信号或边沿信号&#xff0c;具体取决于中断系统的设计和中断源的类型。 二、中断判优 当系统中存在多个中断源时&#xff0…

Unity图形学之CubeMap立方体贴图

1.CubeMap&#xff1a;有六个面的贴图组成 2. 假反射&#xff1a;反射天空盒子 &#xff08;1&#xff09;正常UV采样&#xff1a; &#xff08;2&#xff09;Cube的采样&#xff1a;利用反射角采样&#xff0c;反射角X和Cube的交点采样 Shader "Custom/TestReflect"…

LLM Inference Unveiled

题目&#xff1a;LLM Inference Unveiled: Survey and Roofline Model Insights 链接&#xff1a;https://arxiv.org/abs/2402.16363 这也是一篇推理加速的综述&#xff0c;重点关注一下它的组织结构吧&#xff0c;也就是它对推理加速方法的分类 论文给的全文结构图&#xff…

Cesium的ClearCommand的流程

ClearCommand是在每帧渲染前可以将显存的一些状态置为初始值&#xff0c;就如同把擦黑板。当然也包括在绘制过程中擦掉部分的数据&#xff0c;就如同画家在开始绘制的时候会画导览线&#xff08;如透视线&#xff09;&#xff0c;轮廓出来后这些导览线就会被擦除。 我画了一个…