JavaScript通过ArrayBuffer、TypedArray、DataView和Blob处理二进制数据。1. ArrayBuffer表示固定长度的二进制缓冲区,需配合Uint8Array等视图读写;不同视图共享缓冲区,字节序影响值解析。2. DataView支持指定字节序(大端或小端)进行精确读写,适用于跨平台数据交换。3. Blob用于文件级操作,可由ArrayBuffer创建并生成下载链接。4. 利用FileReader将Blob转为ArrayBuffer,反之可用new Blob()构造器转换。这些对象广泛应用于文件操作、网络通信、音视频处理等场景,实现高效二进制数据操控。

JavaScript 提供了多种方式来处理二进制数据,主要通过 ArrayBuffer、TypedArray、DataView 和 Blob 等对象实现。这些工具适用于文件操作、网络通信(如 WebSocket)、音视频处理、Canvas 图像数据等场景。
1. 使用 ArrayBuffer 和 TypedArray 处理内存中的二进制数据
ArrayBuffer 表示一段固定长度的二进制数据缓冲区。它本身不能直接读写,需通过 TypedArray(如 Uint8Array、Int32Array)或 DataView 来操作。
- 创建 ArrayBuffer:
- 使用 TypedArray 操作数据:
- 不同视图共享同一缓冲区:
let buffer = new ArrayBuffer(8); // 创建一个 8 字节的缓冲区
let uint8 = new Uint8Array(buffer);
uint8[0] = 42; // 写入一个字节
console.log(uint8[0]); // 输出: 42
let int32 = new Int32Array(buffer);
int32[0] = 1; // 写入一个 32 位整数(占 4 字节)
console.log(uint8[0]); // 可能为 1,取决于字节序
2. 使用 DataView 精确控制读写(支持跨平台字节序)
DataView 允许你以指定字节序(大端或小端)读写数据,适合处理协议数据或需要兼容性的场景。
立即学习“Java免费学习笔记(深入)”;
- 创建 DataView:
- 写入和读取指定格式的数据:
let dataView = new DataView(buffer);
大小仅1兆左右 ,足够轻便的商城系统; 易部署,上传空间即可用,安全,稳定; 容易操作,登陆后台就可设置装饰网站; 并且使用异步技术处理网站数据,表现更具美感。 前台呈现页面,兼容主流浏览器,DIV+CSS页面设计; 如果您有一定的网页设计基础,还可以进行简易的样式修改,二次开发, 发布新样式,调整网站结构,只需修改css目录中的css.css文件即可。 商城网站完全独立,网站源码随时可供您下载
dataView.setUint16(0, 255, true); // 在偏移 0 处写入 uint16,小端序
let value = dataView.getUint16(0, true); // 读取,结果为 255
3. 将二进制数据转为 Blob(用于文件下载或上传)
Blob 表示不可变的原始二进制数据,常用于文件操作。
- 从 ArrayBuffer 创建 Blob:
- 创建可下载的文件链接:
let blob = new Blob([buffer], { type: 'application/octet-stream' });
let url = URL.createObjectURL(blob);
let a = document.createElement('a');
a.href = url;
a.download = 'data.bin';
a.click();
URL.revokeObjectURL(url); // 释放内存
4. 在 Blob 和 ArrayBuffer 之间转换
常用于读取用户上传的文件或准备发送到服务器的数据。
- Blob 转 ArrayBuffer:
- ArrayBuffer 转 Blob:
let fileReader = new FileReader();
fileReader.onload = function(e) {
let arrayBuffer = e.target.result;
// 可进一步用 DataView 或 TypedArray 处理
};
fileReader.readAsArrayBuffer(blob);
let newBlob = new Blob([arrayBuffer], { type: 'application/json' });
基本上就这些。掌握 ArrayBuffer 配合 TypedArray 或 DataView 的使用,再结合 Blob 进行文件级操作,就能灵活处理大多数前端二进制任务。常见于图片压缩、音频分析、WebSocket 二进制消息、PDF 生成等场景。









