ArrayBuffer 实践

ArrayBuffer 实践

ArrayBuffer对象、TypedArray视图和DataView视图是 JavaScript 操作二进制数据的一个接口。都是以数组的语法处理二进制数据，所以统称为二进制数组。主要用于二进制数据的通信。

ArrayBuffer 以数组的形式直接操作内存，提升了脚本的性能。二进制数组由三类对象组成。

• ArrayBuffer 对象
• TypedArray 视图
• DataView 视图

ArrayBuffer 对象使用

ArrayBuffer对象代表储存二进制数据的一段内存，它不能直接读写，只能通过视图（TypedArray视图和DataView视图)来读写，视图的作用是以指定格式解读二进制数据。

注意: ArrayBuffer 不能直接读写，必须通过 TypedArray 或 DataView才能进行读写。

// 创建 ArrayBuffer, 分配一段连续内存区域, 默认值为0
const buf = new ArrayBuffer(32);
// 获取 ArrayBuffer 长度
console.log(buf.byteLength); // 32
// ArrayBuffer 拷贝
const newBuffer = buf.slice(0, 3); // 从 0 ~ 3(不包括3拷贝)
// 判断是否是视图
const buffer = new ArrayBuffer(8);
ArrayBuffer.isView(buffer) // false

TypedArray 视图

同一段内存，不同数据有不同的解读方式，这就叫做“视图”（view）。

ArrayBuffer有两种视图，一种是TypedArray视图，另一种是DataView视图。前者的数组成员都是同一个数据类型，后者的数组成员可以是不同的数据类型。

目前，TypedArray视图一共包括 9 种类型，每一种视图都是一种构造函数。

• Int8Array：8 位有符号整数，长度 1 个字节。
• Uint8Array：8 位无符号整数，长度 1 个字节。
• Uint8ClampedArray：8 位无符号整数，长度 1 个字节，溢出处理不同。
• Int16Array：16 位有符号整数，长度 2 个字节。
• Uint16Array：16 位无符号整数，长度 2 个字节。
• Int32Array：32 位有符号整数，长度 4 个字节。
• Uint32Array：32 位无符号整数，长度 4 个字节。
• Float32Array：32 位浮点数，长度 4 个字节。
• Float64Array：64 位浮点数，长度 8 个字节。

// 创建 TypedArray
const buffer = new ArrayBuffer(8);
const typed = new Int32Array(buffer);
// 普通数组的操作方法和属性，对 TypedArray 数组完全适用。
let ui8 = Uint8Array.of(0, 1, 2);
for (let byte of ui8) {
   
  console.log