js文件处理—Blob 操作 及 File 说明

https://developer.mozilla.org/zh-CN/docs/Web/API/Blob

一、Blob对象的API：

• 属性：

1. size： 对象所包含数据的大小（字节）。
2. type：表明该 Blob 对象所包含数据的 MIME 类型。如果类型未知，则该值为空字符串。

• 方法

1. slice()：返回一个新的 Blob 对象，包含了源 Blob 对象中指定范围内的数据。
2. stream()：返回一个能读取blob内容的 ReadableStream。
3. text()：返回一个promise且包含blob所有内容的UTF-8格式的 USVString。
4. arrayBuffer()：返回一个promise且包含blob所有内容的二进制格式的 ArrayBuffer 

二、Blob.text() 对象：https://developer.mozilla.org/zh-CN/docs/Web/API/Blob/text

　　返回值：返回一个 promise 对象，以 resolve 状态返回一个以文本形式包含 blob 中数据的 USVString。并且该数据总是被识别为 UTF-8 格式。

var textPromise = blob.text();

blob.text().then(text => /* 执行的操作…… */);

var text = await blob.text();

 

 

 

---

 

File对象   https://developer.mozilla.org/zh-CN/docs/Web/API/File

一、File 对象来源：

　　1、通常情况下， File 对象是来自用户在一个 <input> 元素上选择文件后返回的 FileList 对象,也可以是来自由拖放操作生成的 DataTransfer 对象，或者来自 HTMLCanvasElement 上的 mozGetAsFile() API。

　　    【File 对象是特殊类型的 Blob，file对象的接口继承了blob对象的属性和方法】

　　2、File对象除了通过 <input>元素产生外，也可以直接通过 File 构造函数实现。https://developer.mozilla.org/zh-CN/docs/Web/API/File/File

var file = new File(["foo"], "foo.txt", {
  type: "text/plain",
});

　　　　File 构造函数 生成的 file对象和 blob对象，功能上都差不多。所以我们一般很少使用 File 构造函数去生成 file对象。