## Blob **2、Blob** Blob（Binary Large Object）對象代表了一段二進制數據，提供了一系列操作接口。比如通過new Blob()創建的對象就是Blob對象.又比如,在XMLHttpRequest里,如果指定responseType為blob,那么得到的返回值也是一個blob對象. **2.1 生成Blob對象** 生成Blob對象有兩種方法：一種是使用Blob構造函數，另一種是對已有的Blob對象使用slice()方法切出一段。 **（1）Blob構造函數** ``` var blob = new Blob(data, type) ``` Blob構造函數接受兩個參數： 參數data是一組數據，所以必須是數組，即使只有一個字符串也必須用數組裝起來. 參數type是對這一Blob對象的配置屬性，目前也只有一個type也就是相關的MIME需要設置 type的值： 'text/csv,charset=UTF-8' 設置為csv格式，并設置編碼為UTF-8 'text/html' 設置成html格式 注意：任何瀏覽器支持的類型都可以這么用 ``` var blob = new Blob(['我是Blob'],{type: 'text/html'}); ``` **2.2 屬性** ``` blob.size //Blob大小（以字節為單位） blob.type //Blob的MIME類型，如果是未知，則是“ ”（空字符串） ``` **2.3 slice()** slice()返回一個新的Blob對象，包含了源Blob對象中指定范圍內的數據。 ``` blob.slice( optional long long start, optional long long end, optional DOMString contentType }; ``` 參數說明： start 可選，開始索引,可以為負數,語法類似于數組的slice方法.默認值為0. end 可選，結束索引,可以為負數,語法類似于數組的slice方法.默認值為最后一個索引. contentType可選 ，新的Blob對象的MIME類型,這個值將會成為新的Blob對象的type屬性的值,默認為一個空字符串. **2.4 Blob的使用** 使用Blob最簡單的方法就是創建一個URL來指向Blob： ``` <a download="data.txt" id="getData">下載</a> var data= 'Hello world!'; var blob = new Blob([data], { type: 'text/html,charset=UTF-8' }); window.URL = window.URL || window.webkitURL; document.querySelector("#getData").href = URL.createObjectURL(blob); ``` 上面的代碼將Blob URL賦值給a，點擊后提示下載文本文件data.txt，文件內容為“Hello World”。 **2.5 URL.createObjectURL()** ``` objectURL = URL.createObjectURL(blob); ``` 使用URL.createObjectURL()函數可以創建一個Blob URL，參數blob是用來創建URL的File對象或者Blob對象，返回值格式是：blob://URL。 注意：在每次調用 createObjectURL() 方法時，都會創建一個新的 URL 對象，即使你已經用相同的對象作為參數創建過。當不再需要這些 URL 對象時，每個對象必須通過調用 URL.revokeObjectURL() 方法傳入創建的URL為參數，用來釋放它。瀏覽器會在文檔退出的時候自動釋放它們，但是為了獲得最佳性能和內存使用狀況，你應該在安全的時機主動釋放掉它們。 **2.6 亂碼問題** 當數據中包含漢字時，導出的文件可能會出現亂碼，不過我們可以這樣解決： ``` var data = "\ufeff" + "漢字"; ```