1、Blob 对象表示一个不可变、原始数据的类文件对象。
构造函数：new Blob(array, options)。
参数array：是一个数据数组，可以是多种对象的数据，包含 ArrayBuffer、Blob、String 等等。
参数options：可选对象，指定两个属性：
type 表示Blob对象数据的MIME类型；
endings 指定包含行结束符\n的字符串如何写入。
示例 const blob = new Blob(['123456789'], {type : 'text/plain'});
常用方法：
let subBlob = blob.slice(0, 3)
//返回一个新的 Blob 对象，包含了源 Blob 对象中指定范围内的数据。
console.log(subBlob)//Blob
blob.text().then((txt) => {
//返回一个 promise，其会兑现一个包含 Blob 所有内容的 UTF-8 格式的字符串
console.log(txt);//123456789
});
blob.arrayBuffer().then((buffer) => {
//返回一个 promise，其会兑现一个包含 Blob 所有内容的二进制格式的ArrayBuffer
console.log(buffer);//ArrayBuffer
});
let rs = blob.stream();
//返回一个能读取 Blob 内容的 ReadableStream
console.log(rs)
2、File对象继承了Blob对象，是一种特殊类型的Blob，它扩展了对系统文件的支持能力。
构造函数：new File(bits, name[, options])
bits：是一个数据数组，可以是多种对象的数据，与Blob对象类似
name：文件名称
options：可选属性对象，包含两个选项
type：MIME类型字符串
lastModified：时间戳，表示文件的最后修改时间
示例： const file = new Blob(['123456789'], {type : 'text/plain'});
常用方法：
let subFile = file.slice(0, 3)
//返回一个新的 File 对象，包含了源 File 对象中指定范围内的数据。
3、对Blob和File的读取
主要有FileReader、URL.createObjectURL()、createImageBitmap()和XMLHttpRequest.send()。
3.1、fileReader是用于异步读取文件类型（或原始数据缓冲区）的内容，指定Blob或File对象为需要读取的文件数据。
let fileReader = new FileReader();
fileReader.readAsText(file, [encoding]);//读取txt文件,参数encoding可选
fileReader.readAsDataURL(file);//读取图像或者能够嵌入到html文档的格式文件，并返回data: URL 格式的 Base64 字符串
readAsBinaryString(file)//以原始二进制数据类型读取Blob中的内容
fileReader.readAsArrayBuffer(file);//读取任意类型的文件，并返回ArrayBuffer数据对象
fileReader.onerror = function(e){console.log(e)}
fileReader.onabort = function(e){console.log(e)}
fileReader.onloadstart = function(e){console.log(e)}
fileReader.onprogress = function(e){console.log(e)}
fileReader.onloadend = function(e){console.log(e)}
fileReader.onload = function (e) {
let result = e.target.result;
console.log(result);
};
3.2URL.createObjectURL()。URL是浏览器环境提供的，用于处理url链接的一个接口对象。可以通过它，解析、构造、规范和编码各种url链接。而URL提供的一个静态方法 createObjectURL()，可以用来处理Blob和File文件对象。
示例：
const url = URL.createObjectURL(file)
const img = new Image()
img.onload = () => { document.body.append(img) }
img.src = url //blob:http://localhost:8088/29c8f4a5-9b47-436f-8983-03643c917f1c
Object URL 又被称为Blob URL，一般使用Blob或File对象生成，通过 URL.createObjectURL() 方法创建一个唯一的URL。
Object URL的格式为：blob:origin/唯一标识(uuid)。
上面生成的URL字符串就符合这个格式：blob:http://localhost:8088/29c8f4a5-9b47-436f-8983-03643c917f1c。
origin 对应的 http://localhost:8088/，如果直接打开本地html文件，则origin为null。
uuid 对应 29c8f4a5-9b47-436f-8983-03643c917f1c。
浏览器内部会为生成Object URL保持一个 URL 到 Blob 的映射，Blob是留存在内存中，浏览器只有在卸载当前窗口文档时才会释放。
如果要手动释放，则需要URL的另外一个静态方法：URL.revokeObjectURL()，它用于销毁之前创建的URL实例，在合适的时机调用即可销毁Object URL。
URL.revokeObjectURL(url)
3.3createImageBitmap()
createImageBitmap(): 主要处理图片资源，接受不同的图片资源对象为参数，并生成一个ImageBitmap对象。
这些参数就就可以是Blob和File对象。
示例：
createImageBitmap(file).then(imageBitmap => {
const canvas = document.createElement('canvas')
canvas.width = imageBitmap.width
canvas.height = imageBitmap.height
const ctx = canvas.getContext('2d')
ctx.drawImage(imageBitmap, 0, 0)
document.body.append(canvas)
})
3.4XMLHttpRequest.send()
XMLHttpRequest.send(body)：用于在XHR的HTTP请求中，发送数据体。这里的body参数，可以是多种数据类型，包括Blob对象。
示例：
const xhr = new XMLHttpRequest()
xhr.send(new Blob())
4、ArrayBuffer
ArrayBuffer 对象表示通用的、固定长度的原始二进制缓冲区，它是一个字节数组，但不能直接操作它的内容，而需要通过其他方式(如TypeArray或DataView等)进行处理。
构造函数：new ArrayBuffer(length)，返回一个指定大小的ArrayBuffer对象。
参数length：要创建的 ArrayBuffer 的字节大小。大于Number.MAX_SAFE_INTEGER（>= 2 ** 53）或为负数，则抛出一个RangeError异常。
首先获取一个arrayBuffer示例：
const reader = new FileReader()
reader.readAsArrayBuffer(file)
reader.onload = async (event) => {
console.log(event.target.result)
}
由于我们无法直接操作ArrayBuffer，所以需要使用其他对象来处理，下面将介绍其中两种。
4.1TypeArray，即类型化数组，它描述了二进制数据缓冲区的一个类数组。TypeArray本身不是一个可用的对象，只是一个辅助的数据类型，作为所有类型数组的构造原型，真正可用的类型数组包含了多种，如Int8Array、Uint8Array等。
常用的类型数组如下表所示：
类型化数组与普通数据也较相似，同样拥有一系列的方法和属性，但不支持 push、pop、shift、unshift、splice 等可以改变原数组的增删改方法。
类型化数组由于定义了数据类型，则各元素必须是同类型的数据，不能像普通数据那样元素可以是不同类型；当元素数据类型固定统一时，处理效率更优。
各类型数组在构造函数、属性、方法等语法上相同，下面就以 Uint8Array 为例。
构造函数：
new Uint8Array()
new Uint8Array(length)
new Uint8Array(typedArray)
new Uint8Array(object)
new Uint8Array(buffer [, byteOffset [, length]])
静态属性和方法：
BYTES_PER_ELEMENT：返回数组元素所占字节数，Uint8Array中的值是1，Uint32Array中的值是4，见上表
length：固定长度，Uint8Array中的值是1，Uint32Array中的值是3，基本没用
name：类型数组返回自己的构造名，Uint8Array类型返回 Uint8Array，Uint32Array类型返回 Uint32Array 等等
from(source[, mapFn[, thisArg]])：从源类型数组中返回一个新的数组
of(element0[, element1[, …[, elementN]]])：创建一个具有可变数量参数的新类型数组
