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()创建对象URL | let blob = new Blob([arrayBuffer], {type: 'image/jpeg'}); |
| File | 继承自Blob，表示用户系统上的具体文件 | 用于处理用户上传的文件，可以获取文件名、大小等信息 | let file = new File([blob], 'filename.jpg', {type: 'image/jpeg'}); |
| Uint8Array | 8位无符号整数类型数组，用于存储0到255之间的整数 | 用于处理8位图像数据、字节流等 | let uint8Array = new Uint8Array(buffer); |
| Uint16Array | 16位无符号整数类型数组，用于存储0到65535之间的整数 | 用于处理音频数据、图像数据等 | let uint16Array = new Uint16Array(buffer); |
| Float32Array | 32位浮点数类型数组，用于存储浮点数 | 用于处理浮点数的二进制数据，如科学计算、物理模拟等 | 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固定长度的二进制数据缓冲区，不直接操作具体的数据，而是通过类型数组或DataView对象来读写用于存储和处理大量的二进制数据，如文件、图像等let buffer new ArrayBuffer(16);TypedArray基于ArrayBuffer对象的视图…...
uniapp开发h5端使用video播放mp4格式视频黑屏，但有音频播放解决方案
mp4格式视频有一些谷歌播放视频黑屏，搜狗浏览器可以正常播放 可能和视频的编码格式有关，谷歌只支持h.264编码格式的视频播放 将mp4编码格式修改为h.264即可 转换方法： 如果是自己手动上传文件可以手动转换 如果是后端接口调取的地址就需…...
Hive的分区与排序
一、Hive分区 1.引入： 在大数据中，最常见的一种思想就是分治，我们可以把大的文件切割划分成一个个的小的文件，这样每次操作一个个小的文件就会很容易了，同样的道理，在hive当中也是支持这种思想的ÿ…...
4.9)
Objective-C学习笔记(内存管理、property参数)4.9
1.引用计数器retainCount：每个对象都有这个属性，默认值为1，记录当前对象有多少人用。 为对象发送一条retain/release消息，对象的引用计数器加/减1，为对象发一条retainCount,得到对象的引用计数器值，当计数器…...
C语言进阶课程学习记录-第29课 - 指针和数组分析（下）
C语言进阶课程学习记录-第29课 - 指针和数组分析（下） 数组名与指针实验-数组形式转换实验-数组名与指针的差异实验-转化后数组名加一的比较实验-数组名作为函数形参小结 本文学习自狄泰软件学院 唐佐林老师的 C语言进阶课程，图片全部来源于课…...
一起学习python——基础篇（13）
前言，python编程语言对于我个人来说学习的目的是为了测试。我主要做的是移动端的开发工作，常见的测试主要分为两块，一块为移动端独立的页面功能，另外一块就是和其他人对接工作。 对接内容主要有硬件通信协议、软件接口文档。而涉…...
SOCKS代理概述
在网络技术的广阔领域中🌐，SOCKS代理是一个核心组件，它在提升在线隐私保护🛡️、实现匿名通信🎭以及突破网络访问限制🚫方面发挥着至关重要的作用。本文旨在深入探讨SOCKS代理的基础，包括其定义…...
AI助力M-OFDFT实现兼具精度与效率的电子结构方法
编者按：为了使电子结构方法突破当前广泛应用的密度泛函理论（KSDFT）所能求解的分子体系规模，微软研究院科学智能中心的研究员们基于人工智能技术和无轨道密度泛函理论（OFDFT）开发了一种新的电子结构计算框架…...
【数据结构】单链表（一）
上一篇【数据结构】顺序表-CSDN博客 我们了解了顺序表，但是呢顺序表涉及到了一些问题，比如，中间/头部的插入/删除，时间复杂度为O(N);增容申请空间、拷贝、释放旧空间会有不小的消耗；增容所浪费的空间... 我们如何去解…...
SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测
SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测 目录 SCI一区 | Matlab实现INFO-TCN-BiGRU-Attention向量加权算法优化时间卷积双向门控循环单元注意力机制多变量时间序列预测预测效果基本介绍模型描述程…...
Coursera吴恩达《深度学习》课程总结（全）
这里有Coursera吴恩达《深度学习》课程的完整学习笔记，一共5门课：《神经网络和深度学习》、《改善深层神经网络》、《结构化机器学习项目》、《卷积神经网络》和《序列模型》， 第一门课：神经网络和深度学习基础，介绍一…...
C# 操作PDF表单 - 创建、填写、删除PDF表单域
通常情况下，PDF文件是不可编辑的，但PDF表单提供了一些可编辑区域，允许用户填写和提交信息。PDF表单通常用于收集信息、反馈或进行在线申请，是许多行业中数据收集和交换的重要工具。 PDF表单可以包含各种类型的输入控件࿰…...
Astropy:探索宇宙奥秘的Python工具箱
Astropy:探索宇宙奥秘的Python工具箱 什么是Astropy库？ Astropy 是一个面向天文学领域的 Python 库，旨在提供常用的天文学数据结构、单位转换、物理常数以及天文学计算方法等功能。它为天文学家和研究人员提供了丰富的工具，用于处理和分析天文…...
java数据结构与算法刷题-----LeetCode684. 冗余连接
java数据结构与算法刷题目录（剑指Offer、LeetCode、ACM）-----主目录-----持续更新(进不去说明我没写完)：https://blog.csdn.net/grd_java/article/details/123063846 文章目录 并查集 并查集 解题思路：时间复杂度O( n ∗ l o g 2…...
循环神经网络简介
卷积神经网络相当于人类的视觉，但是它并没有记忆能力，所以它只能处理一种特定的视觉任务，没办法根据以前的记忆来处理新的任务。比如，在一场电影中推断下一个时间点的场景，这个时候仅依赖于现在的场景还不够࿰…...
计算机网络 子网掩码与划分子网
一、实验要求与内容 1、需拓扑图和两个主机的IP配置截图。 2、设置网络A内的主机IP地址为“192.168.班内学号.2”，子网掩码为“255.255.255.128”，网关为“192.168.班内学号.1”；设置网络B内的主机IP地址为“192.168.班内学号100.2”&#…...
HUD抬头显示器中如何设计LCD的阳光倒灌实验
关键词：阳光倒灌实验、HUD光照温升测试、LCD光照温升测试、太阳光模拟器 HUD（Head-Up Display，即抬头显示器）是一种将信息直接投影到驾驶员视线中的技术，通常用于飞机、汽车等驾驶舱内。HUD系统中的LCD（Liq…...
Shoplazza闪耀Shoptalk 2024，新零售创新解决方案引领行业新篇章！
在近期举办的全球零售业瞩目盛事——Shoptalk 2024大会上,全球*的零售技术平台-店匠科技(Shoplazza)以其*的创新实力与前瞻的技术理念,成功吸引了与会者的广泛关注。此次盛会于3月17日至20日在拉斯维加斯曼德勒湾隆重举行,汇聚了逾万名行业精英。在这场零售业的盛大聚会上,Shop…...
Linux：sprintf、snprintf、vsprintf、asprintf、vasprintf比较
这些函数都在stdio.h里，不过不同系统不同库，有些函数不一定提供。 1. sprintf 函数原型： int sprintf (char *str, const char *format, ...); extern int sprintf (char *__restrict __s, const char *__restrict __format, ...); 功能是将…...
Github远程仓库改名字之后，本地git如何配置？
文章目录 缘由解决方案 缘由 今天在github创建一个仓库，备份一下本地电脑上的资料。起初随便起一个仓库名字，后来修改之。既然远程仓库改名，那么本地仓库需要更新地址。这里采用SSH格式。 解决方案 如果你的GitHub仓库改名了，你…...
w3x2lni：魔兽地图跨版本兼容解决方案技术指南
w3x2lni：魔兽地图跨版本兼容解决方案技术指南 【免费下载链接】w3x2lni 魔兽地图格式转换工具 项目地址: https://gitcode.com/gh_mirrors/w3/w3x2lni 价值定位：破解魔兽地图版本壁垒 当你尝试在1.32.8版本魔兽争霸III中运行经典的1.24.4地图时&…...
终极Enformer基因表达预测指南：如何在10分钟内快速部署深度学习模型
终极Enformer基因表达预测指南：如何在10分钟内快速部署深度学习模型 【免费下载链接】enformer-pytorch Implementation of Enformer, Deepminds attention network for predicting gene expression, in Pytorch 项目地址: https://gitcode.com/gh_mirrors/en/enf…...
万象视界灵坛效果展示：血条样式进度条直观呈现各标签置信度差异
万象视界灵坛效果展示：血条样式进度条直观呈现各标签置信度差异 1. 平台概览 万象视界灵坛是一款基于OpenAI CLIP技术的高级多模态智能感知平台。它通过创新的像素风格界面，将复杂的视觉识别任务转化为直观的交互体验。平台采用16-Bit游戏美学设计&…...
新手入门指南：在快马平台用万文通思路打造你的第一个文本转换网页
今天想和大家分享一个特别适合编程新手的实践项目——用万文通思路在InsCode(快马)平台快速搭建文本转换网页。这个项目完全不需要复杂的环境配置，打开浏览器就能完成，特别适合想体验完整开发流程的初学者。 项目核心功能设计 这个网页的核心功能非常简单…...
MoveIt2新手必看：如何正确选择安装分支（main vs. tutorials）及使用vcs管理多仓库
MoveIt2分支选择与多仓库管理实战指南 当你在ROS2生态中开始使用MoveIt2时，第一个拦路虎往往不是算法理解或代码编写，而是如何正确搭建开发环境。MoveIt2作为由数十个独立Git仓库组成的复杂项目，其分支管理和版本协同问题困扰着许多中级开发者…...
intv_ai_mk11开源可部署实践：支持Webhook回调，可对接企业微信/钉钉/飞书通知
intv_ai_mk11开源可部署实践：支持Webhook回调，可对接企业微信/钉钉/飞书通知 1. 项目概述 intv_ai_mk11是一款基于Llama架构的AI对话机器人，拥有7B参数规模，能够运行在GPU服务器上。这个开源项目不仅提供了强大的对话能力&#…...
从IPv4到IPv6：除了地址变长，这些‘隐藏’特性（流标签、扩展头、无状态配置）你了解吗？
从IPv4到IPv6：除了地址变长，这些‘隐藏’特性（流标签、扩展头、无状态配置）你了解吗？ 当大多数人谈论IPv6时，第一反应往往是"地址长度从32位扩展到128位"。但地址空间的扩展只是IPv6最表层的改进…...
基于Dify的智能问答系统：从意图识别到规范化回复的全流程设计
1. 从零开始理解Dify智能问答系统 第一次接触Dify时，我完全被它的可视化编排能力惊艳到了。这个平台就像搭积木一样，让不懂代码的产品经理也能设计出复杂的AI应用。举个实际例子，去年我们团队要做一个游泳健身领域的问答助手，传统…...
3步掌握DDrawCompat：轻松解决Windows老游戏兼容性的终极方案
3步掌握DDrawCompat：轻松解决Windows老游戏兼容性的终极方案 【免费下载链接】DDrawCompat DirectDraw and Direct3D 1-7 compatibility, performance and visual enhancements for Windows Vista, 7, 8, 10 and 11 项目地址: https://gitcode.com/gh_mirrors/dd/…...
英雄联盟智能游戏助手：提升游戏效率与自动化操作的全方位解决方案
英雄联盟智能游戏助手：提升游戏效率与自动化操作的全方位解决方案 【免费下载链接】League-Toolkit An all-in-one toolkit for LeagueClient. Gathering power 🚀. 项目地址: https://gitcode.com/gh_mirrors/le/League-Toolkit 在快节奏的英雄联…...