一、 Blob 和 File 的区别
Blob 和 File 都是 JavaScript 中用于处理二进制数据的对象，但它们有一些区别。
Blob
定义：
Blob表示不可变的、原始数据的类文件对象。它通常用于存储大块的二进制数据，比如图像、音频或视频文件等。特点：
Blob对象可以包含任意类型的数据，不仅限于文本或二进制数据。它的数据是只读的，你不能直接修改Blob中的数据。创建方式： 可以通过构造函数
Blob或BlobBuilder来创建Blob对象。
// 使用构造函数创建 Blob var blob = new Blob(["Hello, World!"], { type: "text/plain" });File
定义：
File是Blob的子类，通常用于表示用户选择的文件。它包含了文件的元信息，如文件名、大小、修改时间等。特点： 除了继承
Blob的特性外，File还包含文件的相关信息，例如文件名 (name)、文件的最后修改时间 (lastModifiedDate)、文件的 MIME 类型 (type) 等。创建方式： 通常通过用户交互选择文件，然后通过
File构造函数创建。
// 通过用户选择创建 File 对象 <input type="file" id="fileInput" /> var fileInput = document.getElementById('fileInput'); var file = fileInput.files[0];总结：
Blob是用于存储任意类型的二进制数据的对象，而File是Blob的一种特殊情况，用于表示用户选择的文件，并包含了文件的相关信息。Blob通常用于一般的二进制数据存储，而File更适合表示文件对象。File是Blob的扩展，因此File具有Blob的所有功能，并在此基础上添加了文件相关的元信息。
二、 Blob、File、Base64 三种类型的相互转换
- File 转 Blob
const blob = new Blob([file], {
type: file.type });
- File/Blob 转 Base64
// 创建一个新的 FileReader 对象
const reader = new FileReader();
// 读取 File 对象
reader.readAsDataURL(file/blob);
// 加载完成后
reader.onload = () => {
// 将读取的数据转换为 base64 编码的字符串
const base64String = reader.result.split(',')[1];
}
- Base64 转 Blob
const base64ToBlob = base64 => {
let arr = base64.split(','), // 使用逗号 , 将传入的 base64 字符串分割成一个数组。因为 base64 编码的字符串通常以 data:image/jpeg;base64, 这样的格式开头，所以这一步是为了去掉开头的部分。
mime = arr[0].match(/:(.\*?);/)[1], // 使用正则表达式从分割后的数组的第一个元素中提取 MIME 类型。例如，对于 data:image/jpeg;base64,，它将提取 image/jpeg
bstr = window.atob(arr[1]), // 使用 atob 方法将 base64 编码的字符串（去掉开头的部分后）解码为普通的字符串。
n = bstr.length, // 获取解码后的字符串的长度。
u8arr = new Uint8Array(n); // 创建一个新的 Uint8Array 对象，长度为解码后的字符串的长度。Uint8Array 是一个用于处理无符号 8 位整数的数组类型。
while (n--) {
// 循环从最后一个字符开始，向前遍历解码后的字符串。
u8arr[n] = bstr.charCodeAt(n); // 将解码后的字符串的每个字符转换为对应的 ASCII 码值，然后存储到 u8arr 数组中。
}
return new Blob([u8arr], {
// 创建一个新的 Blob 对象，其中包含之前转换的二进制数据。
type: mime, // 设置 Blob 对象的 MIME 类型为之前提取的类型。
});
};
- Base64 转 File
const base64ToFile = (base64, fileName) => {
let arr = base64.split(',');
let mime = arr[0].match(/:(.\*?);/)[1];
let bstr = atob(arr[1]);
let n = bstr.length;
let u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], fileName, {
type: mime});
};
