typedarray.prototype.buffer属性指向其底层arraybuffer,实现多视图共享内存;修改任一视图会实时影响其他重叠视图,需注意字节偏移、类型解释及字节序。

TypedArray.prototype.buffer 属性指向底层的 ArrayBuffer,这是实现多个视图共享同一块内存的关键。只要 TypedArray 实例基于同一个 ArrayBuffer 创建,它们就操作同一段原始字节,修改一个视图会实时反映在另一个视图中。
获取并复用同一 buffer
创建 TypedArray 时,可显式传入已有 ArrayBuffer,或通过已有视图的 .buffer 属性获取后复用:
- 先创建一个
ArrayBuffer(例如new ArrayBuffer(16)) - 用它构造不同类型的视图:
new Uint8Array(buffer)、new Int16Array(buffer)、new Float32Array(buffer) - 所有视图的
.buffer都严格相等(===),且长度以字节为单位一致
注意字节偏移与视图边界
共享 buffer 不代表所有视图覆盖完全相同的字节范围。每个 TypedArray 可指定 byteOffset 和 length(元素个数),实际占用字节为 length × BYTES_PER_ELEMENT:
- 例如
new Uint8Array(buffer, 4, 8)从第 4 字节开始,占 8 字节 -
new Int32Array(buffer, 0, 2)从头开始,占2 × 4 = 8字节 - 若两个视图的字节范围重叠,读写就会相互影响——这是共享内存的核心机制,也是越界风险的来源
跨视图读写需考虑类型解释规则
同一段内存被不同视图解释时,结果取决于类型大小和字节序(小端/大端):
-
Uint8Array[0] = 0xFF后,Uint16Array[0]若起始位置相同,其值可能是0x00FF或0xFF00(取决于平台字节序) - 写
Float32Array[0] = 1.0会覆盖 4 个字节,此时用Uint8Array读这 4 字节,得到的是 IEEE 754 编码的原始字节 - 务必确保读写逻辑与数据布局匹配,否则出现“乱码”或静默错误
实际用途示例
常见于高性能场景:
-
图像像素处理:用
Uint8ClampedArray操作 RGBA 字节,同时用Uint32Array快速批量赋值 32 位颜色值 -
网络协议解析:接收一整块二进制数据(
ArrayBuffer),用Uint8Array解析头部,再用Float64Array提取后续浮点字段 - WebGL 数据上传:顶点坐标、法线、纹理坐标共用一个 buffer,用不同视图分段映射到 GPU 内存










