1、什么是Blob
Blob的本质是一个js二进制大对象(存储的内容为文件),是不可修改的,读取方式为FileReader
2、如何创建
<script>
new Blob(array,options)
array:由ArrayBuffer、ArrayBufferView、Blo、DOMString等对象(文件数据源)
options:它可能会指定如下两种属性(指定文件类型/文件格式)
1. type:默认值为"",表示将会被放入到blob中的数组内容的MIME类型。
2. endings:默认值为"transparent",用于指定包含行结束符\n的字符串如何被写入,不常用
</script>
| MIME类型 | 描述 |
|---|---|
| text/plain | 纯文本文档 |
| text/html | HTML文档 |
| text/javascript | JavaScript文件 |
| text/css | CSS文件 |
| application/json | JSON文件 |
| application/pdf | PDF文件 |
| application/xml | XML文件 |
| image/jpeg | JPEG图像 |
| image/png | PNG图像 |
| image/gif | GIF图像 |
| image/svg+xml | SVG图像 |
| audio/mpeg | MP3文件 |
| video/mpeg | MP4文件 |
3、分片
<script>
Blob对象内置了slice()方法用来将blob对象分片;
其中有三个参数:
start:这是分片起点,默认值为0;
end:设置切片终点,默认值为blob.size;
contentType:设置新blob的MIME类型。如果省略type,则默认值为blob的原始值
</script>
4、演示
<script>
//1、创建
let blob = new Blob(['helloWorld'],{type:"text/plain"})
//2、分片
let blob2 = blob.slice(0,5,"text/plain")
//3、读取
let reader = new FileReader()
reader.readAsText(blob2)
console.log(reader)
</script>
#文档参考自:bilibiliUP主我们一起学前端#