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);
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 生成等场景。
