ArrayBuffer
为了满足 JavaScript 与显卡之间大量的、实时的数据交换，它们之间的数据通信必须是二进制的，而不能是传统的文本格式。文本格式传递一个 32 位整数，两端的 JavaScript 脚本与显卡都要进行格式转化，将非常耗时。这时要是存在一种机制，可以像 C 语言那样，直接操作字节，将 4 个字节的 32 位整数，以二进制形式原封不动地送入显卡，脚本的性能就会大幅提升。
ArrayBuffer 代表内存之中的一段二进制数据，可以通过“视图”进行操作。“视图”部署了数组接口，这意味着，可以用数组的方法操作内存。它不能直接读写，只能通过视图（TypedArray视图和DataView视图）来读写，视图的作用是以指定格式解读二进制数据。
二进制数据相关操作在实际应用开发中发挥重要作用(file、fetch、xmlHttpRequest、canvas、webSocket)，但又常常被前端工程师所忽视。详细可查看《ECMAScript 6 入门 ArrayBuffer》。
Blob
Blob 对象表示一个二进制文件的数据内容，通常用来读写文件。
const blob = new Blob(array [, options]);
参数：
array: 可以是一个由 ArrayBuffer , ArrayBufferView , Blob , DOMString 等对象构成的 Array，表示新生成的 Blob 实例对象的内容。options:type: 指定类型。endings: 内容结尾的换行符是否需要适配宿主系统。
属性:
size: 文件的大小，单位为字节。type: 文件的类型。
方法:
slice: 用法与Array的slice相同，常用于数据分片。
const newBlob = oldBlob.slice([start [, end [, contentType]]])
File 与 FileList
文件对象，继承于 Blob，并且可以用在任意的 Blob 对象的 context 中(如 FileReader，URL.createObjectURL())。FileList 为成员为 File 的类数组。
const file = new File(array, name[, options]);
参数：
array: 与Bolb构造器的第一个参数相同。name: 文件名或文件路径。options:type: 指定类型。lastModified: 最后修改时间(时间戳)。
属性:
name: 文件名。type: 指定类型size: 文件大小（单位字节）lastModified: 最后修改时间。
FileReader
用于web应用读取 File 或 Blob 对象的操作API对象。
属性:
readyState: 当前读取状态。- 0: 为加载。
- 1: 加载中。
- 2: 加载完成。
result: 读取完成后文件的内容。error: 读取文件时发生的错误。
事件:
onloadstart: 读取操作开始。onabort: 读取操作被中断。onprogress: 读取Blob。onloadend: 读取操作结束。onload: 读取操作完成。onerror: 读取操作发生错误。
方法:
abort: 终止读取操作。readAsArrayBuffer: 读取完成后返回一个ArrayBuffer实例。readAsBinaryString: 读取完成后返回二进制字符串。readAsText: 读取完成后返回文本字符串。readAsDataURL: 读取完成后返回base64的DataURL。
文件对象关系图
