FileReader对象

　　FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。

文件处理是一系列的流程。每一步我们都需要知道，自己能做什么，自己做了什么。

1.获取文件

前端中，获取文件必须使用input标签。

<input id='file' type='file' />

处理这个文件。这里主要是使用input标签的onchange事件。

var file = document.getELementById('file');
file.onchange = function(e){
    var files = e.target.files;    //这个files就是获取的file文件的一个数组。之后你可以使用任何方式来操作它。
}

 

 

2.读取文件

（1）读取文件，主要使用的是FileReader类。它提供了几个方法

readAsText(file, encoding) —— 以纯文本形式读取文件，读取到的文本保存在result属性中。第二个参数代表编码格式。

readAsDataUrl(file) —— 读取文件并且将文件以数据URI的形式保存在result属性中。

readAsBinaryString(file)——读取文件并且把文件以字符串保存在result属性中。

readAsArrayBuffer(file)——读取文件并且将一个包含文件内容的ArrayBuffer保存咋result属性中。

（2）文件读取的过程是异步操作，在这个过程中提供了三个事件。progress、error、load事件

progress——每隔50ms左右，会触发一次progress事件。

error——在无法读取到文件信息的条件下触发。

load——在成功加载后就会触发。