- js虽然没有操作文件的能力,但是前端还是有一些文件和二进制的应用,比如文件下载、图片预览等
- 今天就主要以实现以上两个功能展开探讨
- 首先js文件相关的有
Blob
、File
还有FileReader
- 我们先依次介绍一下这三个对象
1.Blob
1)HTML5中的Blob对象只是二进制数据的容器,本身并不能操作二进制
2)使用时通过构造函数实例化对象,lob() 构造函数返回一个新的 Blob 对象
let aBlob = new Blob( array, options );
参数:
(1) array 是一个由ArrayBuffer
,ArrayBufferView
,Blob
,DOMString
等对象构成的Array
(2) options 它可能会指定如下两个属性:type
(数组内容的MIME类型)和**endings
**(主要是处理结束符,比如native
:结束符会被更改为操作系统文件系统的换行符,transparent
:就保持不变)
3)
blob.slice()
方法用于创建一个包含源 Blob的指定字节范围内的数据的新 Blob 对象。
2.File
1)
File
其实是继承自Blob
类的,比如input元素type为file 值就是file对象
2) File() 构造器创建新的 File 对象实例。
var myFile = new File(bits, name[, options]);
3)参数
bits
与Blob
的array
一致,name
:表示文件名称,或者文件路径。
options
:type
:也与Bolb
一致,lastModified
: 数值,表示文件最后修改时间的Unix
时间戳
3.FileReader
1)使用FileReader对象,web应用程序可以异步的读取存储在用户计算机上的文件(或者原始数据缓冲)内容,可以使用File对象或者Blob对象来指定所要处理的文件或数据。
2)常用方法及事件
abort():void 终止文件读取操作
readAsArrayBuffer(file)