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

JS中的常见二进制数据格式

格式描述用途示例
ArrayBuffer固定长度的二进制数据缓冲区,不直接操作具体的数据,而是通过类型数组或DataView对象来读写用于存储和处理大量的二进制数据,如文件、图像等let buffer = new ArrayBuffer(16);
TypedArray基于ArrayBuffer对象的视图,提供特定格式的读写接口用于操作具有特定数据类型的二进制数据let int32View = new Int32Array(buffer);
DataView提供对ArrayBuffer的复杂和灵活读写操作,可以读写任意位置的任意类型的数据当需要精确控制二进制数据的读写位置和格式时使用let dataView = new DataView(buffer);
Blob表示不可变的原始数据,通常是二进制数据或文本数据用于处理文件、图片等二进制数据,可以通过URL.createObjectURL()创建对象URLlet blob = new Blob([arrayBuffer], {type: 'image/jpeg'});
File继承自Blob,表示用户系统上的具体文件用于处理用户上传的文件,可以获取文件名、大小等信息let file = new File([blob], 'filename.jpg', {type: 'image/jpeg'});
Uint8Array8位无符号整数类型数组,用于存储0到255之间的整数用于处理8位图像数据、字节流等let uint8Array = new Uint8Array(buffer);
Uint16Array16位无符号整数类型数组,用于存储0到65535之间的整数用于处理音频数据、图像数据等let uint16Array = new Uint16Array(buffer);
Float32Array32位浮点数类型数组,用于存储浮点数用于处理浮点数的二进制数据,如科学计算、物理模拟等let float32Array = new Float32Array(buffer);

部分使用示例:
 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><title>二进制格式转换示例</title></head><body><input type="file" id="fileInput" accept="*" /><button onclick="convertFileToBinaryFormats()">转换文件为二进制格式</button><pre id="output"></pre><script>function convertFileToBinaryFormats() {const fileInput = document.getElementById("fileInput");const file = fileInput.files[0];if (!file) {alert("未选择文件");return;}let reader = new FileReader(); // 使用let而不是constreader.onload = function (event) {const arrayBuffer = event.target.result;// ArrayBufferconsole.log("ArrayBuffer:", arrayBuffer);// TypedArray (例如 Uint8Array)const uint8Array = new Uint8Array(arrayBuffer);console.log("Uint8Array:", uint8Array);// DataViewconst dataView = new DataView(arrayBuffer);console.log("DataView:", dataView);// Blobconst blob = new Blob([arrayBuffer], { type: file.type });console.log("Blob:", blob);// 显示部分Uint8Array内容作为示例const output = `文件类型: ${file.type}<br>`;output += `ArrayBuffer长度: ${arrayBuffer.byteLength} 字节<br>`;output += `Uint8Array前10个字节: ${Array.from(uint8Array.slice(0, 10)).map((b) => b.toString(16).padStart(2, "0")).join(" ")}<br>`;document.getElementById("output").textContent = output;};reader.readAsArrayBuffer(file);}</script></body>
</html>

相关文章:

JS中的常见二进制数据格式

格式描述用途示例ArrayBuffer固定长度的二进制数据缓冲区&#xff0c;不直接操作具体的数据&#xff0c;而是通过类型数组或DataView对象来读写用于存储和处理大量的二进制数据&#xff0c;如文件、图像等let buffer new ArrayBuffer(16);TypedArray基于ArrayBuffer对象的视图…...

uniapp开发h5端使用video播放mp4格式视频黑屏,但有音频播放解决方案

mp4格式视频有一些谷歌播放视频黑屏&#xff0c;搜狗浏览器可以正常播放 可能和视频的编码格式有关&#xff0c;谷歌只支持h.264编码格式的视频播放 将mp4编码格式修改为h.264即可 转换方法&#xff1a; 如果是自己手动上传文件可以手动转换 如果是后端接口调取的地址就需…...

Hive的分区与排序

一、Hive分区 1.引入&#xff1a; 在大数据中&#xff0c;最常见的一种思想就是分治&#xff0c;我们可以把大的文件切割划分成一个个的小的文件&#xff0c;这样每次操作一个个小的文件就会很容易了&#xff0c;同样的道理&#xff0c;在hive当中也是支持这种思想的&#xff…...

Objective-C学习笔记(内存管理、property参数)4.9

1.引用计数器retainCount&#xff1a;每个对象都有这个属性&#xff0c;默认值为1&#xff0c;记录当前对象有多少人用。 为对象发送一条retain/release消息&#xff0c;对象的引用计数器加/减1&#xff0c;为对象发一条retainCount,得到对象的引用计数器值&#xff0c;当计数器…...

C语言进阶课程学习记录-第29课 - 指针和数组分析(下)

C语言进阶课程学习记录-第29课 - 指针和数组分析&#xff08;下&#xff09; 数组名与指针实验-数组形式转换实验-数组名与指针的差异实验-转化后数组名加一的比较实验-数组名作为函数形参小结 本文学习自狄泰软件学院 唐佐林老师的 C语言进阶课程&#xff0c;图片全部来源于课…...

一起学习python——基础篇(13)

前言&#xff0c;python编程语言对于我个人来说学习的目的是为了测试。我主要做的是移动端的开发工作&#xff0c;常见的测试主要分为两块&#xff0c;一块为移动端独立的页面功能&#xff0c;另外一块就是和其他人对接工作。 对接内容主要有硬件通信协议、软件接口文档。而涉…...

SOCKS代理概述

在网络技术的广阔领域中&#x1f310;&#xff0c;SOCKS代理是一个核心组件&#xff0c;它在提升在线隐私保护&#x1f6e1;️、实现匿名通信&#x1f3ad;以及突破网络访问限制&#x1f6ab;方面发挥着至关重要的作用。本文旨在深入探讨SOCKS代理的基础&#xff0c;包括其定义…...

AI助力M-OFDFT实现兼具精度与效率的电子结构方法

编者按&#xff1a;为了使电子结构方法突破当前广泛应用的密度泛函理论&#xff08;KSDFT&#xff09;所能求解的分子体系规模&#xff0c;微软研究院科学智能中心的研究员们基于人工智能技术和无轨道密度泛函理论&#xff08;OFDFT&#xff09;开发了一种新的电子结构计算框架…...

【数据结构】单链表(一)

上一篇【数据结构】顺序表-CSDN博客 我们了解了顺序表&#xff0c;但是呢顺序表涉及到了一些问题&#xff0c;比如&#xff0c;中间/头部的插入/删除&#xff0c;时间复杂度为O(N);增容申请空间、拷贝、释放旧空间会有不小的消耗&#xff1b;增容所浪费的空间... 我们如何去解…...

SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测

SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测 目录 SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测预测效果基本介绍模型描述程…...

Coursera吴恩达《深度学习》课程总结(全)

这里有Coursera吴恩达《深度学习》课程的完整学习笔记&#xff0c;一共5门课&#xff1a;《神经网络和深度学习》、《改善深层神经网络》、《结构化机器学习项目》、《卷积神经网络》和《序列模型》&#xff0c; 第一门课&#xff1a;神经网络和深度学习基础&#xff0c;介绍一…...

C# 操作PDF表单 - 创建、填写、删除PDF表单域

通常情况下&#xff0c;PDF文件是不可编辑的&#xff0c;但PDF表单提供了一些可编辑区域&#xff0c;允许用户填写和提交信息。PDF表单通常用于收集信息、反馈或进行在线申请&#xff0c;是许多行业中数据收集和交换的重要工具。 PDF表单可以包含各种类型的输入控件&#xff0…...

Astropy:探索宇宙奥秘的Python工具箱

Astropy:探索宇宙奥秘的Python工具箱 什么是Astropy库&#xff1f; Astropy 是一个面向天文学领域的 Python 库&#xff0c;旨在提供常用的天文学数据结构、单位转换、物理常数以及天文学计算方法等功能。它为天文学家和研究人员提供了丰富的工具&#xff0c;用于处理和分析天文…...

java数据结构与算法刷题-----LeetCode684. 冗余连接

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 文章目录 并查集 并查集 解题思路&#xff1a;时间复杂度O( n ∗ l o g 2…...

循环神经网络简介

卷积神经网络相当于人类的视觉&#xff0c;但是它并没有记忆能力&#xff0c;所以它只能处理一种特定的视觉任务&#xff0c;没办法根据以前的记忆来处理新的任务。比如&#xff0c;在一场电影中推断下一个时间点的场景&#xff0c;这个时候仅依赖于现在的场景还不够&#xff0…...

计算机网络 子网掩码与划分子网

一、实验要求与内容 1、需拓扑图和两个主机的IP配置截图。 2、设置网络A内的主机IP地址为“192.168.班内学号.2”&#xff0c;子网掩码为“255.255.255.128”&#xff0c;网关为“192.168.班内学号.1”&#xff1b;设置网络B内的主机IP地址为“192.168.班内学号100.2”&#…...

HUD抬头显示器中如何设计LCD的阳光倒灌实验

关键词&#xff1a;阳光倒灌实验、HUD光照温升测试、LCD光照温升测试、太阳光模拟器 HUD&#xff08;Head-Up Display&#xff0c;即抬头显示器&#xff09;是一种将信息直接投影到驾驶员视线中的技术&#xff0c;通常用于飞机、汽车等驾驶舱内。HUD系统中的LCD&#xff08;Liq…...

Shoplazza闪耀Shoptalk 2024,新零售创新解决方案引领行业新篇章!

在近期举办的全球零售业瞩目盛事——Shoptalk 2024大会上,全球*的零售技术平台-店匠科技(Shoplazza)以其*的创新实力与前瞻的技术理念,成功吸引了与会者的广泛关注。此次盛会于3月17日至20日在拉斯维加斯曼德勒湾隆重举行,汇聚了逾万名行业精英。在这场零售业的盛大聚会上,Shop…...

Linux:sprintf、snprintf、vsprintf、asprintf、vasprintf比较

这些函数都在stdio.h里&#xff0c;不过不同系统不同库&#xff0c;有些函数不一定提供。 1. sprintf 函数原型&#xff1a; int sprintf (char *str, const char *format, ...); extern int sprintf (char *__restrict __s, const char *__restrict __format, ...); 功能是将…...

Github远程仓库改名字之后,本地git如何配置?

文章目录 缘由解决方案 缘由 今天在github创建一个仓库&#xff0c;备份一下本地电脑上的资料。起初随便起一个仓库名字&#xff0c;后来修改之。既然远程仓库改名&#xff0c;那么本地仓库需要更新地址。这里采用SSH格式。 解决方案 如果你的GitHub仓库改名了&#xff0c;你…...

【网络安全产品大调研系列】2. 体验漏洞扫描

前言 2023 年漏洞扫描服务市场规模预计为 3.06&#xff08;十亿美元&#xff09;。漏洞扫描服务市场行业预计将从 2024 年的 3.48&#xff08;十亿美元&#xff09;增长到 2032 年的 9.54&#xff08;十亿美元&#xff09;。预测期内漏洞扫描服务市场 CAGR&#xff08;增长率&…...

微信小程序 - 手机震动

一、界面 <button type"primary" bindtap"shortVibrate">短震动</button> <button type"primary" bindtap"longVibrate">长震动</button> 二、js逻辑代码 注&#xff1a;文档 https://developers.weixin.qq…...

大学生职业发展与就业创业指导教学评价

这里是引用 作为软工2203/2204班的学生&#xff0c;我们非常感谢您在《大学生职业发展与就业创业指导》课程中的悉心教导。这门课程对我们即将面临实习和就业的工科学生来说至关重要&#xff0c;而您认真负责的教学态度&#xff0c;让课程的每一部分都充满了实用价值。 尤其让我…...

基于Java Swing的电子通讯录设计与实现:附系统托盘功能代码详解

JAVASQL电子通讯录带系统托盘 一、系统概述 本电子通讯录系统采用Java Swing开发桌面应用&#xff0c;结合SQLite数据库实现联系人管理功能&#xff0c;并集成系统托盘功能提升用户体验。系统支持联系人的增删改查、分组管理、搜索过滤等功能&#xff0c;同时可以最小化到系统…...

AGain DB和倍数增益的关系

我在设置一款索尼CMOS芯片时&#xff0c;Again增益0db变化为6DB&#xff0c;画面的变化只有2倍DN的增益&#xff0c;比如10变为20。 这与dB和线性增益的关系以及传感器处理流程有关。以下是具体原因分析&#xff1a; 1. dB与线性增益的换算关系 6dB对应的理论线性增益应为&…...

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

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

【JVM面试篇】高频八股汇总——类加载和类加载器

目录 1. 讲一下类加载过程&#xff1f; 2. Java创建对象的过程&#xff1f; 3. 对象的生命周期&#xff1f; 4. 类加载器有哪些&#xff1f; 5. 双亲委派模型的作用&#xff08;好处&#xff09;&#xff1f; 6. 讲一下类的加载和双亲委派原则&#xff1f; 7. 双亲委派模…...

【C++进阶篇】智能指针

C内存管理终极指南&#xff1a;智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...

MySQL:分区的基本使用

目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区&#xff08;Partitioning&#xff09;是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分&#xff08;分区&#xff09;可以独立存储、管理和优化&#xff0c;…...

Modbus RTU与Modbus TCP详解指南

目录 1. Modbus协议基础 1.1 什么是Modbus? 1.2 Modbus协议历史 1.3 Modbus协议族 1.4 Modbus通信模型 🎭 主从架构 🔄 请求响应模式 2. Modbus RTU详解 2.1 RTU是什么? 2.2 RTU物理层 🔌 连接方式 ⚡ 通信参数 2.3 RTU数据帧格式 📦 帧结构详解 🔍…...