Blob 是 JavaScript 中表示不可变原始二进制数据的内置对象，用于安全高效封装文件、图片等非文本内容；其不可修改、支持 MIME 类型标记、需通过 URL.createObjectURL 或 FileReader 等桥接操作。
Blob 是 JavaScript 中用于表示不可变、原始二进制数据的内置对象，常用于处理文件、图片、音频、PDF 等非文本内容。它不直接暴露内部字节，而是提供一种安全、高效的方式封装和传递二进制数据。
Blob 的核心特点
Blob 本身不是数组或 Buffer，而是一个“数据容器”： – 构造后不可修改（immutable） – 支持按类型（type）标记 MIME 类型，如 “image/png” 或 “application/pdf” – 实际数据存在浏览器内存中，不会立即解码或解析 – 可通过 URL.createObjectURL() 转为临时 URL，在 img、a、video 等标签中直接使用
如何创建 Blob 对象
常用构造方式是传入数据片段（字符串、ArrayBuffer、TypedArray、其他 Blob）和可选配置：
从字符串创建（注意编码）：
new Blob([“hello”], { type: “text/plain” })从 Uint8Array 创建（推荐处理二进制）：
new Blob([new Uint8Array([0x48, 0x65, 0x6C, 0x6C, 0x6F])], { type: “text/plain” })合并多个 Blob：
new Blob([blob1, blob2, arrayBuffer])
读取和解析 Blob 中的二进制数据
Blob 不能直接 .slice() 或遍历字节，需借助 FileReader 或响应式 API：
用 FileReader 读为 ArrayBuffer：
fr.readAsArrayBuffer(blob) → 在 onload 中获取 fr.result（即原始字节）读为 base64：
fr.readAsDataURL(blob) → 结果含前缀 “data:…;base64,…”读为文本（仅适用于可编码字符）：
fr.readAsText(blob, “utf-8”)现代替代：用 blob.arrayBuffer()（返回 Promise）更简洁：
const buf = await blob.arrayBuffer(); const view = new Uint8Array(buf);
常见实用场景与技巧
实际开发中 Blob 常用于以下情况：
立即学习“Java免费学习笔记（深入）”；
下载生成的文件：创建 Blob + createObjectURL + a.download
const url = URL.createObjectURL(blob); a.href = url; a.download = “report.pdf”; a.click(); URL.revokeObjectURL(url);预览用户选择的图片：直接赋值给 img.src
img.src = URL.createObjectURL(fileInput.files[0]);分片上传大文件：用 blob.slice(start, end) 切出小块，逐个发送避免内存泄漏：用完临时 URL 后务必调用 URL.revokeObjectURL(url)
基本上就这些。Blob 不复杂但容易忽略细节——关键记住它是个“包装器”，真正操作二进制得靠 ArrayBuffer + TypedArray，而展示或传输则靠 URL 或 FileReader 桥接。
以上就是javascript的blob是什么_如何处理二进制数据？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1542908.html
微信扫一扫 
支付宝扫一扫 
