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:
let buffer = new ArrayBuffer(8); // 创建一个 8 字节的缓冲区
使用 TypedArray 操作数据:
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:
let fileReader = new FileReader();
fileReader.onload = function(e) {
let arrayBuffer = e.target.result;
// 可进一步用 DataView 或 TypedArray 处理
};
fileReader.readAsArrayBuffer(blob);
ArrayBuffer 转 Blob:
let newBlob = new Blob([arrayBuffer], { type: ‘application/json’ });
基本上就这些。掌握 ArrayBuffer 配合 TypedArray 或 DataView 的使用,再结合 Blob 进行文件级操作,就能灵活处理大多数前端二进制任务。常见于图片压缩、音频分析、WebSocket 二进制消息、PDF 生成等场景。
以上就是怎样使用JavaScript操作二进制数据(如ArrayBuffer, Blob)?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1526778.html
微信扫一扫
支付宝扫一扫