深入了解JavaScript当中如何确定值的类型

news2025/6/7 6:22:38

JavaScript是一种弱类型语言,当你给一个变量赋了一个值,该值是什么类型的,那么该变量就是什么类型的,并且你还可以给一个变量赋多种类型的值,也不会报错,这就是JavaScript的内部机制所决定的,那么当我们在使用一些方法的时候,必须知道该变量是什么类型的,才能调用该变量对应的一些方法,那么我们如何获取到值的变量呢?

这里我们有三种方法

1.typeof  2.instanceof 3.Object.prototype.toString  下面我将详细讲解一下这三个方法

typeof:

作用:判断一个变量类型

底层原理:js中为了提高性能效率,使用值编码来存储值的类型,读取值编码当中的类型标签位,根据标签值返回对应的类型字符串

类型判断流程:先区分「直接量」与「指针」

直接量表:

数据类型存储形式第 0 位类型判定关键
Boolean小整数(SMI)0值为 0 或 2,且最低位为 0(SMI 标记)。
Number(SMI)32 位有符号整数(SMI)0值非 0/2,且最低位为 0(SMI 标记)。
Undefined全局特殊值(单例)直接比较值是否为 undefined 全局变量,typeof 直接返回 "undefined"

指针表: 

数据类型存储形式低 3 位标签类型判定关键
普通 Object指针000低 3 位为 000
HeapNumber(浮点数)指针001低 3 位为 001
String指针110低 3 位为 110
Symbol指针100低 3 位为 100
BigInt指针101低 3 位为 101
Function(函数)指针011低 3 位为 011
null空指针000

这里null比较特殊,他的低三位和对象object一样,所以会被typeof误判为object对象

这里举一些比较常见的事例: 

console.log(typeof undefined);    // 输出:"undefined"
console.log(typeof null);         // 输出:"object"
console.log(typeof true);         // 输出:"boolean"
console.log(typeof 42);           // 输出:"number"
console.log(typeof "hello");      // 输出:"string"
console.log(typeof Symbol("key"));// 输出:"symbol"
console.log(typeof 100n);         // 输出:"bigint"
console.log(typeof (() => {}));   // 输出:"function"
console.log(typeof {});           // 输出:"object"

//特殊情况
console.log(typeof /test/g); // "object"
console.log(typeof Infinity); // "number"
console.log(typeof NaN); // "number"
console.log(typeof undeclaredVar); // "undefined"(不会报错)

instanceof:

概念:instanceof 是一种操作符,用于判断一个对象是否是某个类(Class)或接口(Interface)的实例。这里需要注意的是,instanceof只能判断对象,不能判断基本类型

原理: instanceof 操作符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上  左边实例对象的内部属性通过 Object.getPrototypeOf() 方法来访问[[Prototype]]

//这里表示instanceof不能直接用于基本类型
console.log(42 instanceof Number); // false

//可以将基本类型通过内置构造函数包装成对象
const numObj = new Number(42);
console.log(numObj instanceof Number); // true

console.log([] instanceof Array); // true
console.log([] instanceof Object); // true
console.log({} instanceof Object); // true

Object.prototype.toString:

概念:

这个方法可以判断一个变量的具体类型,是最精确的检测方式,返回的是一个【object type】格式字符串,它可以识别到所有内置对象的类型

使用方法:

// 基本类型和内置对象
Object.prototype.toString.call({}); // [object Object]
Object.prototype.toString.call([]); // [object Array]
Object.prototype.toString.call(new Date()); // [object Date]
Object.prototype.toString.call(new MyClass()); // [object Object] (默认)

和typeof对比:

类型typeof 结果Object.prototype.toString.call() 结果
[]"object"[object Array]
new Date()"object"[object Date]
/abc/"object"[object RegExp]
null"object"[object Null]
undefined"undefined"[object Undefined]
Symbol(1)"symbol"[object Symbol]

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

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

相关文章

excel数据对比找不同:6种方法核对两列数据差异

工作中,有时需要核对两列数据的差异,用于对比、复核等。数据较少的情况下差异肉眼可见,数据量较大时用什么方法比较好呢?从个人习惯出发,我整理了6种方法供参考。 6种方法核对两列数据差异: 1、Ctrl G定位…

基于智能代理人工智能(Agentic AI)对冲基金模拟系统:模范巴菲特、凯西·伍德的投资策略

股票市场涉及众多统计数据和模式。股票交易基于研究和数据驱动的决策。人工智能的使用可以实现流程自动化,让投资者在研究上花费更少的时间,同时提高准确性。这使他们能够更加专注于监督实际交易和服务客户。 顶尖对冲基金经理发挥着至关重要的作用&…

MySQL数据库基础(二)———数据表管理

前言 上篇文章介绍了MySQL数据库以即数据库的管理 这篇文章将给大家讲解数据表的管理 一、数据表常见操作 数据表常见操作的指令 进入数据库use数据库; 查看当前所有表:show tables; 创建表结构 1.创建表操作 1.1创建表 create table 表名(列名 …

RDMA简介5之RoCE v2队列

在RoCE v2协议中,RoCE v2队列是数据传输的最底层控制机制,其由工作队列(WQ)和完成队列(CQ)共同组成。其中工作队列采用双向通道设计,包含用于存储即将发送数据的发送队列(SQ&#xf…

SAFe/LeSS/DAD等框架的核心适用场景如何选择?

在敏捷开发的规模化实践中,SAFe(Scaled Agile Framework)、LeSS(Large Scale Scrum)和DAD(Disciplined Agile Delivery)是三大主流框架。它们分别以不同的哲学和方法论应对复杂性、协作与交付的…

window查看SVN账号密码

背景 公司的SVN地址发生迁移,想迁移一下本地SVN地址,后来发现SVN账号密码忘记了。写此文章纯记录。 迁移SVN地址: 找到svn目录点击relocate,输入新的svn地址,如需输入账号密码,输入账号密码即完成svn地址…

前端项目初始化

​​​​​​ 目录 1. 安装 nvm 2. 配置 nvm 并切换到 Node.js 16.15.0 3. 安装 LightProxy 代理 4. GIT安装 1. 配置用户名和邮箱(这些信息将用于您在提交代码时的标识): 2. 生成SSH密钥(用于将本地代码仓库与远程存储库连…

USB扩展器与USB服务器的2个主要区别

在现代办公和IT环境中,连接和管理USB设备是常见需求。USB扩展器(常称USB集线器)与USB服务器(如朝天椒USB服务器)是两类功能定位截然不同的解决方案。前者主要解决物理接口数量不足的“近身”连接扩展问题,而…

第46节:多模态分类(图像+文本)

一、多模态分类概述 多模态分类是指利用来自不同模态(如图像、文本、音频等)的数据进行联合分析和分类的任务。 在当今大数据时代,信息往往以多种形式存在,例如社交媒体上的图片配文字、视频附带字幕、医疗检查中的影像与报告等。单一模态的数据往往只能提供有限的信息,…

springMVC-10验证及国际化

验证 概述 ● 概述 1. 对输入的数据(比如表单数据),进行必要的验证,并给出相应的提示信息。 2. 对于验证表单数据,springMVC提供了很多实用的注解, 这些注解由JSR303 验证框架提供. ●JSR 303 验证框架 1. JSR 303 的含义 JSR&#xff0…

LRU 和 DiskLRU实现相册缓存器

我是写Linux后端的(golang、c、py),后端缓存算法通常是指的是内存里面的lru、或diskqueue,都是独立使用。 很少有用内存lru与disklru结合的场景需求。近段时间研究android开发,里面有一些设计思想值得后端学习。 写这…

figma MCP + cursor如何将设计稿生成前端页面

一、准备工作 figma MCP需要通过figma key来获取设计稿权限,key的生成步骤如下 1. 打开figma网页版/APP,进入账户设定 2. 点击生成token 3. 填写内容生成token(一定要确认复制了,不然关闭弹窗后就不会显示了) 二、配置MCP 4. 进入到cursor…

如何理解OSI七层模型和TCP/IP四层模型?HTTP作为如何保存用户状态?多服务器节点下 Session方案怎么做

本篇概览: OSI 七层模型是什么?每一层的作用是什么?TCP/IP四层模型和OSI七层模型的区别是什么? HTTP 本身是无状态协议,HTTP如何保存用户状态? 能不能具体说一下Cookie的工作原理、生命周期、作用域?使用…

【Elasticsearch】映射:Nested 类型

映射:Nested 类型 1.为什么需要 Nested 类型2.如何定义 Nested 类型3.相关操作3.1 索引包含 Nested 数据的文档3.2 查询 Nested 数据3.3 聚合 Nested 数据3.4 排序 Nested 数据3.5 更新 Nested 文档中的特定元素 4.Nested 类型的高级操作4.1 内嵌 inner hits4.2 多级…

Vue3 + UniApp 蓝牙连接与数据发送(稳定版)

本教程适用于使用 uni-app Vue3 (script setup) 开发的跨平台 App(支持微信小程序、H5、Android/iOS 等) 🎯 功能目标 ✅ 获取蓝牙权限✅ 扫描周围蓝牙设备✅ 连接指定蓝牙设备✅ 获取服务和特征值✅ 向设备发送数据包(ArrayBu…

三种读写传统xls格式文件开源库libxls、xlslib、BasicExcel的比较

最近准备读写传统xls格式文件,而不是较新的xlsx,询问DeepSeek有哪些开源库,他给出了如下的简介和建议,还给出了相应链接,不过有的链接已失效。最后还不忘提醒,现在该用xlsx格式了。 以下是几个可以处理传统…

Nature子刊同款的宏基因组免疫球蛋白测序怎么做?

免疫球蛋白A(IgA)是人体肠道黏膜分泌的主要抗体,它在塑造肠道微生物群落和维持肠道稳态中起着关键作用,有研究发现缺乏IgA的患者更容易患自身免疫性疾病和感染性疾病。 目前用于研究IgA结合的主要技术是IgA-SEQ,结合了…

2025年牛客网秋招/社招高质量 Java 面试八股文整理

Java 面试 不论是校招还是社招都避免不了各种面试。笔试,如何去准备这些东西就显得格外重要。不论是笔试还是面试都是有章可循的。关键在于理解企业的需求,明确自己的定位,以及掌握一定的应试技巧。 笔试部分,通常是对基础知识、…

ADI的BF609双核DSP怎么做开发,我来说一说(五)LAN口测试

作者的话 ADI的双核DSP,第二颗是Blackfin系列的BF609,这颗DSP我用了很久,比较熟悉,且写过一些给新手的教程。 硬件准备 ADSP-BF609-CORE:ADI BF609开发板 产品链接:https://item.taobao.com/item.htm?…

行业赋能篇-2-能源行业安全运维升级

在能源行业,尤其是风电领域,运维作业往往面临“三高”挑战——高风险环境、高异构数据量)、高合规要求。以海上风电场为例,传统运维依赖卫星电话沟通,数据记录碎片化,故障因信息传递延迟导致损失扩大。如何…