Blob对象
Blob代表了一中不变的、原数据的类文件对象,它们可以当作text或者binary data或者转换为可读取的流(ReadableStream)。所以它的方法可以被用来处理数据。Blobs表示的不一定是JavaScript原生格式的数据。File接口基于Blob,继承了blob的功能并且拓展了它以支持使用用户系统上的文件。
为了从非blob对象和数据构建一个Blob,可以使用Blob()构造函数。为了创建一个包含另一个blob‘s数据的子集的blob对象,可以使用slice()方法。为了获取一个在用户系统上的文件的Blob对象,可以看File文档。
Blob(blobParts[, option])
返回一个新创建的包含了Blob对象,其内容为参数中给定的数组串联组成。
-
Blob.size 只读
Blob对象包含的数据大小,单位是字节(bytes)。 -
Blob.type 只读
Blob包含数据的MIME类型。如果类型是未知的,它的值为空。
-
Blob.slice([start[, end[, contentType]]])
返回一个新的
Blob对象,包含了源Blob对象中指定范围的数据 -
Blob.stream()
返回一个可以读取
blob内容的流。 -
Blob.text()
返回一个promise,返回一个包含了blob完整内容,并格式为
UTF-8格式显示的USVString -
Blob.arrayBuffer()
返回一个promise,返回一个包含了blob整个内容,并且格式为
binary data的ArrayBuffer对象
创建一个blob对像
var debug = {hello: 'string'};
var blob = new Blob([JSON.stringify(debug, null, 2)], {type: 'application/json'});

使用Blob创建一个指向类型化数组的URL
下面的代码创建了一个JavaScript类型化数组并且创建一个新的Blob对象包含了类型化数组的数据,并且调用createObjectURL()函数将blob转换成URL。
let typedArrayToURL = (typedArray, mimeType) => {
return URL.createObjectURL(new Blob([typedArray.buffer]), {type: mimeType})
};
let bytes = new Uint8Array(59);
for ( let i = 0; i < 59; i++ ) {
bytes[i] = 32 + i;
}
let url = typedArrayToURL(bytes, "text/plain");
let link = document.createElement("a");
link.href = url;
link.innerText = "Open the array URL";
document.body.appendChild(link);
从Blob对象抽取数据
FileReader是一种从Blob中读取数据的方式。
var reader = new FileReader();
reader.onload = function (e) {
var result = reader.result;
}
reader.readAsArrayBuffer(blob);
另一种从Blob中读取内容的方式是使用一个响应。下面代码读取Blob内容为text
var text = await (new Response(blob)).text();
当然还可以使用FileReader的readAsText()来读取字符串,或者ReadAsDataURL()来读取data URL。
遗弃: 通过`BlobBuilder`创建blobs。
在有Blob()构造器之前,使用BlobBuilder API来创建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对象在JavaScript中用于表示不可变的原始数据,常用于处理二进制数据。它可以是任何格式,且提供了多种方法如slice、stream和text等来操作数据。创建Blob通常使用Blob构造函数,结合ArrayBuffer、String等数据。此外,可以通过URL.createObjectURL创建指向Blob的URL,便于数据展示或下载。BlobBuilder已被废弃,现在推荐直接使用Blob接口。

被折叠的 条评论
为什么被折叠?



