### 構造函數 [`FileReader()`](https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader/FileReader "使用?FileReader()?構造器去創建一個新的?FileReader.") ### 獲取文件對象 ``` var fileInput = document.getElementById("fileInput"); fileInput.addEventListener('change', function(event) { var file = fileInput.files[0]; // 或file = fileInput.files.item(0); console.log(file); }, false); ``` ### 使用FileReader讀取文件 ``` // 實例化 var reader = new FileReader(); // 監聽讀取完畢事件 reader.addEventListener("load", function () { // 根據讀取形式返回結果 console.log(reader.result); }, false); reader.readAsDataURL(file); // 讀取base64 參數為 blob文件對象 // `readAsDataURL`?方法會讀取指定的?Blob?對象表示一個不可變、原始數據的類文件對象。 // Blob 表示的不一定是JavaScript原生格式的數據。 // File?接口基于Blob，繼承了 blob 的功能并將其擴展使其支持用戶系統上的文件。 // 讀取操作完成的時候，readyState 會變成已完成`DONE`，并觸發 loadend 事件 // 同時 result 屬性將包含一個`data:`URL格式的字符串（base64編碼）以表示所讀取文件的內容。 // 其他方法 // 讀取出 ArrayBuffer 數據對象 readAsArrayBuffer() // 讀取字符串 默認以utf-8讀取 readAsText() ```