ArrayBuffer 是固定长度的原始二进制内存容器,不可直接读写,需通过 TypedArray 或 DataView 操作;TypedArray 适合同类型数值序列,DataView 适合混合类型、非对齐或需控制端序的场景。

ArrayBuffer 是一段固定长度的原始二进制内存
ArrayBuffer 本身不提供读写能力,它只是底层内存的“容器”。你不能直接用 arrayBuffer[0] 访问字节,也不能调用 .push() 或 .length(它只有 .byteLength)。真正操作数据靠的是视图(TypedArray 或 DataView)。
常见误用是把 ArrayBuffer 当成普通数组:比如试图用 for...of 遍历、或传给 JSON.stringify —— 这些都会失败或返回空对象。
- 创建:
const buf = new ArrayBuffer(8); // 分配 8 字节
- 必须配合视图使用:
const view = new Uint8Array(buf); // 现在可以读写了
- 注意:
buf和view共享同一段内存,改view[0]就等于改了buf的第 0 字节
用 TypedArray 快速处理同类型数值序列
当你有一串整数或浮点数要存为二进制(比如音频采样、图像像素),Uint8Array、Int16Array、Float32Array 是最常用的选择。它们自动按类型对齐、做边界检查,并且支持数组方法如 .map()、.slice()(返回新视图,不拷贝底层 ArrayBuffer)。
关键点是:类型决定每个元素占多少字节,也决定如何解释内存。例如 new Int16Array(buf) 把每 2 字节当一个有符号 16 位整数;若用错类型(比如用 Uint8Array 读原本是 Float32Array 写入的数据),结果完全不可预测。
立即学习“Java免费学习笔记(深入)”;
技术上面应用了三层结构,AJAX框架,URL重写等基础的开发。并用了动软的代码生成器及数据访问类,加进了一些自己用到的小功能,算是整理了一些自己的操作类。系统设计上面说不出用什么模式,大体设计是后台分两级分类,设置好一级之后,再设置二级并选择栏目类型,如内容,列表,上传文件,新窗口等。这样就可以生成无限多个二级分类,也就是网站栏目。对于扩展性来说,如果有新的需求可以直接加一个栏目类型并新加功能操作
- 初始化时可传长度(分配新
ArrayBuffer):const arr = new Uint8Array(4); // [0, 0, 0, 0]
- 也可传已有
ArrayBuffer+ offset + length:const sub = new Uint8Array(buf, 2, 3); // 从第 2 字节起取 3 字节
- 转换回
ArrayBuffer:arr.buffer(注意不是arr.byteLength,那是视图长度)
DataView 更适合混合类型或非对齐读写
当你要在一个 buffer 里混着读 uint8、int32、float64,或者需要控制大小端(endianness),就得用 DataView。它不绑定数据类型,所有读写都显式指定类型和偏移量,且默认小端(littleEndian = true 可选)。
典型场景:解析网络协议头、文件格式(如 PNG header)、或与 C 结构体对接。这时候如果硬用 TypedArray,容易因对齐或端序出错 —— 比如 Uint32Array 强制 4 字节对齐,但协议字段可能从第 3 字节开始。
- 必须传
ArrayBuffer构造:const dv = new DataView(buf);
- 读写带偏移和端序:
dv.setUint32(0, 0x12345678, false); // 大端写入
console.log(dv.getUint32(0, true)); // 小端读出
- 没有
.length,只有.byteLength和.byteOffset
ArrayBuffer 不能直接 JSON 序列化,也不参与垃圾回收“自动释放”
JSON.stringify(new ArrayBuffer(10)) 返回 {};JSON.parse() 也无法还原。需要手动转成 Uint8Array 再用 Array.from() 或 .reduce() 转为普通数组,或用 ArrayBuffer.slice()(ES2024+)配合 Blob / base64 传输。
更隐蔽的问题是内存泄漏:只要还有一个 TypedArray 或 DataView 持有对某个 ArrayBuffer 的引用,整个 buffer 就不会被 GC 回收 —— 即使你只用了其中几个字节。大文件处理中,忘记清理视图引用(比如闭包里长期持有 Uint8Array)会导致内存持续增长。
- 安全转 JSON:
const arr = new Uint8Array(buf);
JSON.stringify(Array.from(arr)); // → [0,1,2,...] - 释放大 buffer:
arr = null; // 清除视图引用
buf = null; // 清除 buffer 引用
// 确保无其他引用,GC 才能回收 - 注意:
buf.slice(start, end)返回新ArrayBuffer,旧的仍存在,需手动置null
TypedArray),还是协议级精细控制(选 DataView),再决定怎么传、怎么清、怎么跨上下文传递。端序、对齐、引用生命周期,这三个地方最容易出问题。









