Blob 对象表示一个不可变、原始数据的类文件对象。Blob 表示的不一定是JavaScript原生格式的数据。File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
要从其他非blob对象和数据构造一个Blob，请使用 Blob() 构造函数。要创建包含另一个blob数据的子集blob，请使用 slice()方法。要获取用户文件系统上的文件对应的Blob对象，请参阅 File文档。
接受Blob对象的API也被列在 File 文档中。
slice()方法原本接受length作为第二个参数，以表示复制到新Blob 对象的字节数。如果设置的参数使start + length超出了源Blob对象的大小，那返回的则是从start到结尾的数据。slice() 方法在某些浏览器和版本上带有浏览器引擎前缀：比如 Firefox 12及更早版本的blob.mozSlice() 和Safari中的blob.webkitSlice()。 没有浏览器引擎前缀的老版本slice()方法有不同的语义，并且已过时。 Firefox 30 中取消了对blob.mozSlice()的支持。构造函数
Blob(blobParts[, options])- 返回一个新创建的
Blob对象，其内容由参数中给定的数组串联组成。
属性
方法
Blob.slice([start,[ end ,[contentType]]])- 返回一个新的
Blob对象，包含了源Blob对象中指定范围内的数据。
示例
Blob 构造函数用法举例
Blob() 构造函数 允许用其它对象创建 Blob 对象。比如，用字符串构建一个 blob：
var debug = {hello: "world"};
var blob = new Blob([JSON.stringify(debug, null, 2)],
{type : 'application/json'});
BlobBuilder 接口提供了另外一种创建Blob对象的方式，但该方式现在已经废弃，不应继续使用：
var builder = new BlobBuilder();
var fileParts = ['<a id="a"><b id="b">hey!</b></a>'];
builder.append(fileParts[0]);
var myBlob = builder.getBlob('text/xml');
示例：使用 Blob 创建一个指向类型化数组的URL
参考下面的代码：
var typedArray = GetTheTypedArraySomehow();
var blob = new Blob([typedArray], {type: "application/octet-binary"});// 传入一个合适的MIME类型
var url = URL.createObjectURL(blob);
// 会产生一个类似blob:d3958f5c-0777-0845-9dcf-2cb28783acaf 这样的URL字符串
// 你可以像使用一个普通URL那样使用它，比如用在img.src上。
示例：从 Blob 中提取数据
从Blob中读取内容的唯一方法是使用 FileReader。以下代码将 Blob 的内容作为类型数组读取：
var reader = new FileReader();
reader.addEventListener("loadend", function() {
// reader.result 包含转化为类型数组的blob
});
reader.readAsArrayBuffer(blob);
通过使用 FileReader 的其它方法可以把Blob读取为字符串或者数据URL。
规范
| Specification | Status | Comment |
|---|---|---|
| File API Blob |
Working Draft | Initial definition |
浏览器兼容性
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Basic support | 5[1] | (Yes) | 4[2] | 10 | 11.10[1] | 5.1[1] |
slice() |
10 webkit 21 |
(Yes) | 5 moz[3] 13 |
10 | 12 | 5.1 webkit |
Blob() constructor |
20 | (Yes) | 13.0 (13.0) | 10 | 12.10 | 6 |
| Feature | Android | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Basic support | ? | (Yes) | 13.0 (13.0) | ? | ? | ? |
slice() |
? | (Yes) | ? | ? | ? | ? |
Blob() constructor |
? | (Yes) | ? | ? | ? | ? |
[1]WebKit 和 Opera 11.10 版本实现的 slice() 使用 length来作为第二个参数。但是，因为这语法异于 Array.slice() 和 String.slice()，WebKit 已经将其移除，并添加了 Blob.webkitSlice()来支持这个新的语法。
[2] Firefox 4 版本实现的 slice() 使用 length来作为第二个参数。但是，因为这语法异于 Array.slice() 和 String.slice()，Gecko 已经将其移除，并添加了mozSlice()来支持这个新的语法。
[3] 在Gecko 12.0 (Firefox 12.0 / Thunderbird 12.0 / SeaMonkey 2.9) 之前，有个bug会影响slice()的行为，就是参数 start和 end的值不能超出64位有符号数字范围，现已修复。
[4] 请看 bug 1048325。
Gecko 备注：特权许可
要使用 chrome 代码，JSM 和 Bootstrap 作用域，你必须像这样导入它:
Cu.importGlobalProperties(['Blob']);Blob可以在 Worker 作用域内使用。