前言
在前端开发里，Blob 其实并不陌生：导出文件、预览图片、处理大文件上传时，经常会碰到它。很多人对这个概念'听过但没真正拆开看过'，等到项目里真要用的时候，才发现它不只是一个'能装二进制数据的容器'这么简单。
这篇文章就把 Blob 的核心概念、常见用法和相关 API 串起来讲清楚，尽量让它回到一个工程师真正会用、会踩坑、也会记住的状态。
什么是 Blob
Blob 是 Binary Large Object 的缩写，表示一段二进制数据。你可以把它理解成一个'类文件对象'：它存放的是原始数据，本身不可直接修改，适合拿来表示图片、音频、文本、压缩包，甚至是一段待下载的内容。
const blob = new Blob(["Hello, world!"], { type: "text/plain" });
上面这段代码创建了一个最简单的 Blob。数据内容是字符串，但经过 Blob 包装后，它就可以被当作文件一样去处理，比如下载、预览、传输。
Blob 的几个关键特性
Blob 有几个点值得记住：
- 不可变：创建之后，内容不能原地修改
- 有类型信息：可以通过
type标识 MIME 类型 - 可分片：支持通过
slice()截取其中一部分 - 适合文件化处理：很多浏览器 API 都能直接接收
Blob
这些特性决定了它特别适合做'中间态数据'：既能承载内容，又能方便地交给下载、读取、上传这些流程处理。
Blob 的构造方式
Blob 的构造函数形式如下：
new Blob(blobParts, options);
其中：
blobParts：数据片段数组，常见类型包括ArrayBuffer、ArrayBufferView、Blob、DOMStringoptions：可选配置，主要是：type：指定 MIME 类型endings：处理字符串中的换行符写入方式
实际开发里，最常用的还是 type。它会影响浏览器对这段数据的理解，比如是文本、图片，还是 Word 文档。
常见使用场景
文件下载
前端生成文件并触发下载时，Blob 基本是绕不开的。思路很直接：先把内容包装成 Blob，再通过 URL.createObjectURL() 生成临时链接，最后模拟点击下载。
function downloadFile(content, filename, type) {
blob = ([content], { type });
url = .(blob);
a = .();
a. = url;
a. = filename;
a.();
.(url);
}
(, , );
