FileReader簡介
一、屬性（以下屬性均為只讀）
| 屬性 | 介紹 |
| error | 在讀取文件時發生的錯誤 |
| readyState | FileReader對象當前的狀態， 有三個： 0,1,2， 分別對應的常量名為EMPTY、LOADING、DONE， 分別表示數據還沒有開始讀取，正在讀取，讀取成功 |
| result | 讀取完成之后的內容 只有在讀取完成之后有效 格式由用哪個函數讀取決定 例如： 用readAsBinaryString函數，讀取完之后就是二進制字符串， 具體參見方法 |
二、方法
| 方法 | 描述 | 參數 |
| abort() | 中止讀取操作 | 無 |
| readAsArrayBufffer() | 讀取File或Blob對象，並將讀取完成的內容放在result屬性中，readState 置為2，如果定義了事件處理函數onloadend,會在執行完之后調用。 這四個函數的不同處就在於在result中生成的內容格式不一樣。 readAsArrayBufffer執行完之后會在result屬性中生成一個ArrayBuffer格式的內容； readAsBinaryString生成的是所讀取文件的原始二進制數據； readAsDataUrl將包含一個data readAsText是一個字符串的讀取結果。 |
將要讀取的File或Blob對象 |
| readAsBinaryString() | 同上 | |
| readAsDataURL() | 同上 | |
| readAsText() | arguments[0]:將要讀取的File或Blob對象 arguments[1]: 可選一個字符串,表示了返回數據所使用的編碼.如果不指定,默認為UTF-8. |
DataURL是一種格式，用base64將內容加密，然后將加密后的內容放在URL中，一般格式小的圖片，字體圖標或者其他體積小的文件可以用這種格式展現，可以http減少請求次數。
三、事件處理函數
| 方法 | 描述 | 事件對象 |
| onabort |
當讀取操作被中止時調用 | 事件對象中有是否冒泡， 事件類型 已讀取量 讀取總量等屬性， 可自行打印查看 |
| onerror | 當讀取操作發生錯誤時調用 | |
| onload | 當讀取操作完成且成功時調用 | |
| onloadend | 當讀取操作完成時調用,不管是成功還是失敗.該處理程序在onload或者onerror之后調用 |
|
| onloadstart | 當讀取操作將要開始之前調用 | |
| onprogress | 在讀取數據過程中周期性調用(例如設置加載進度條時會使用) |
四、瀏覽器兼容
谷歌 7
IE 10
火狐 3.6
歐朋和蘋果未實現
五、應用場景
按指定格式讀取本地文件到腳本對象中，然后進行文件上傳前的展示，判斷
我是什么時候用到的呢，就是在圖片上傳之前要將需要上傳的圖片展示給用戶，並需要判斷圖片寬高分別是多少像素等
這時候就要new一個FileReader對象，然后將inputElement.files[0]傳入readAsDataURL方法，獲取地址，將FileReader對象的result屬性給指定Image對象的src，就可以在本地顯示圖片了
這時候獲取圖片寬高的話應該不是圖片原始的值,要想解決這個問題還需要new一個image對象，然后將FileReader對象的result屬性賦值給這個new出來的對象的src屬性，再獲取image對象的 naturalWidth,naturalHeight就可以了
六、參考鏈接
https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader