arraybuffer操作_JavaScript - ArrayBuffer 介绍

什么是 ArrayBuffer

JavaScript 中最基础的二进制对象 ArrayBuffer，可以表示对固定长度的连续内存的引用，但是用户不能直接操作这块内存，必须通过 "View Object" 来操作。

let buffer = new ArrayBuffer(16); // 创建长度为 16 byte 的连续内存

其中 “View Object" 大致可以分为两类

• TypedArray
• DataView

其中，DataView 指的是自定自定义的解析器，不作详细讨论。
TypedArray 有一下几种

• Uint8Array, Uint16Array, Uint32Array
  • – for unsigned integers of 8, 16, and 32 bits.
• Uint8ClampedArray
  • – for 8-bit integers, “clamps” them on assignment.
• Int8Array, Int16Array, Int32Array
  • – for signed integer numbers (can be negative).
• Float32Array, Float64Array
  • – for signed floating-point numbers of 32 and 64 bits.

栗子

Unit8Array

• 指的是，把 ArrayBuffer 的每个 byte(8-bit) 当作一个单独的无符号整型数字 (0 - 255)

比如我们用下面的代码创建一个数组，那这个数组底层使用 ArrayBuffer 实现的，一共占用了 4 byte 的内存

let arr = new Uint8Array([10, 11, 12, 13]);
alert(arr.length); // 4, created binary array of the same length
alert(arr[1]); // 11, filled with 4 bytes (unsigned 8-bit integers) with given values

总结

同理

• Unit16Array 表示为使用 16 bits (2 bytes) 表示一个无符号整型 (0 ~ 2^16-1) 的数的数组
• Int8Array 表示使用 8 bits 表示一个有符号整型 (-128 ~ 127)
• Float32Array 表示使用 32 bits 表示一个浮点数
• Unit7ClampedArray 在 0 ～ 255 范围内和 Unit8Array 是一样的，对超出范围的处理有所不同，和图像处理相关（一般像素范围也是 0 ～ 255）

下图是一个方便对照的图表

Ref

• https://javascript.info/arraybuffer-binary-arrays