ArrayBuffer、DataView、TypedArray 都是什么

ArrayBuffer

定义

ArrayBuffer是 JavaScript 中的一个对象，用于表示通用的、固定长度的原始二进制数据缓冲区。它是一个字节序列，本身没有格式，不提供直接的读写操作，就像是一个装满字节的容器，等待进一步的处理来解释和操作这些字节。

作用

• 处理二进制数据

  • 在很多场景下，需要处理二进制数据，如文件读取、网络通信、图像处理等。ArrayBuffer提供了一种存储这些二进制数据的方式。例如，当从服务器通过fetch或XMLHttpRequest获取二进制文件（如图片、音频、视频等）时，返回的数据可以存储在ArrayBuffer中。

• 与其他数据类型的桥梁

  • 它是连接 JavaScript 高级数据类型（如Array、Object）和底层二进制数据的桥梁。通过DataView或TypedArray（如Uint8Array、Int16Array等）接口，可以将ArrayBuffer中的二进制数据转换为有意义的 JavaScript 数据类型，或者反过来，将 JavaScript 数据转换为二进制格式存储在ArrayBuffer中。
  • 例如，在处理音频数据时，音频的原始样本数据可以存储在ArrayBuffer中，然后使用Uint8Array或Int16Array来访问这些数据，根据音频的采样率、声道数等参数进行处理，将其转换为可以在<audio>标签中播放的格式。

• 跨平台和跨语言数据交互

  • 在 Web 开发中，ArrayBuffer有助于实现与其他语言或平台的数据交互。因为二进制数据格式是一种通用的语言，很多编程语言和系统都能够理解和处理。当与 WebAssembly（一种低级字节码格式，用于在浏览器中运行接近原生性能的代码）交互时，ArrayBuffer经常被用来传递数据。例如，将 JavaScript 中的数据转换为ArrayBuffer，传递给 WebAssembly 模块进行高性能的计算，然后再将结果转换回 JavaScript 数据类型。

• 内存管理和性能优化

  • ArrayBuffer可以在一定程度上帮助进行内存管理。由于它是固定长度的缓冲区，开发者可以明确地控制数据的大小和内存占用。在处理大量数据时，合理地使用ArrayBuffer可以避免不必要的内存复制和浪费，提高性能。例如，在处理大数据集的可视化时，将数据存储在ArrayBuffer中，根据需要逐步加载和处理，可以优化内存使用和渲染性能。

TypedArray（类型化数组）

定义

TypedArray 不是一个单一的类型，而是一组用于操作ArrayBuffer对象的视图类型，包括Int8Array、Uint8Array、Int16Array、Uint16Array、Int32Array、Uint32Array、Float32Array和Float64Array等。这些类型化数组提供了一种以特定数据类型来访问和操作ArrayBuffer中二进制数据的方式。

作用

• 数据访问和解析

  • 当有一个ArrayBuffer存储了二进制数据时，TypedArray 可以按照指定的数据类型来读取这些数据。例如，如果ArrayBuffer中存储的是一系列字节表示的整数，使用Int32Array可以将这些字节以 32 位整数的形式读取出来。假设ArrayBuffer中有 8 个字节的数据，使用Int32Array视图可以将其看作是两个 32 位整数（因为每个 32 位整数占 4 个字节）。

• 数据存储和构建

  • 反过来，TypedArray 也可以用于将 JavaScript 中的数据转换为二进制格式并存储到ArrayBuffer中。例如，要将一个包含多个 32 位整数的 JavaScript 数组存储为二进制数据，可以创建一个Int32Array，将数据赋值给它，然后通过其buffer属性获取对应的ArrayBuffer，这个ArrayBuffer就包含了以二进制形式存储的整数数据。

• 性能优化

  • 在处理大量数据时，TypedArray 比普通的 JavaScript 数组更接近底层硬件的操作方式，能够提供更好的性能。比如在进行数学计算、图形处理（如处理像素数据）等场景中，使用合适的 TypedArray 可以减少类型转换的开销，加快数据处理速度。

DataView

定义

DataView是一个允许在ArrayBuffer上以多种数据类型进行灵活读写操作的接口。与 TypedArray 不同，它不会将整个ArrayBuffer强制解释为一种特定的数据类型，而是可以在ArrayBuffer的任意位置，按照指定的数据类型（如读取一个字节作为Uint8，下一个位置读取两个字节作为Int16等）进行读写操作。

作用

• 灵活的数据读写

  • 当ArrayBuffer中的数据格式比较复杂，包含多种不同类型的数据混合在一起时，DataView非常有用。例如，在一个自定义的二进制文件格式中，文件头部可能包含几个字节的文件类型标识符（Uint8），接着是文件长度（Int32），然后是一些其他的数据。DataView可以在ArrayBuffer的不同位置，根据需要的格式读取这些数据。

• 字节序处理

  • DataView还提供了对字节序（大端序和小端序）的控制。在处理网络数据或者跨平台数据时，字节序可能会不同。DataView可以通过设置byteOrder属性（可以是'big-endian'或'little-endian'）来正确地读取和写入数据，确保数据的一致性和正确性。例如，在解析网络协议数据时，需要根据协议规定的字节序来读取数据，DataView就可以满足这种需求。