ArrayBuffer
ArrayBuffer對象用來表示通用的、固定長度的原始二進制數據緩沖區。ArrayBuffer是不可以直接操作的，而是要通過類型數組對象或 DataView 對象來操作，它們會將緩沖區中的數據表示為特定的格式，並通過這些格式來讀寫緩沖區的內容，詳細的可以查看這篇文章：前端二進制學習（三）。
var buffer = new ArrayBuffer(8); console.log(buffer.byteLength); // 輸出字節new ArrayBuffer時，傳入的參數表示要創建的字節數。
blob
blob(binary large object)，他表示一個不可變、原始數據的類文件對象，在我的這篇前端二進制學習（一）文章中有詳細的介紹。
blob和arraybuffer一樣，是二進制的容器，直接new Blob就可以創建了：
new Blob([123]);blob類型只有slice方法，用於返回一個新的 Blob對象，包含了源 Blob對象中指定范圍內的數據。 對比發現，ArrayBuffer的數據，是可以按照字節去操作的，而Blob的只能作為一個整的對象去處理。所以說，ArrayBuffer相比Blob更接近真實的二進制，更底層。
ArrayBuffer與Blob互轉
ArrayBuffer轉Blob
arraybuffer轉blob很方便，作為參數傳入就行了。
var buffer = new ArrayBuffer(16); var blob = new Blob([buffer]);Blob轉ArrayBuffer
此處需要借助fileReader對象了，
var blob = new Blob([1,2,3,4,5]); var reader = new FileReader(); reader.onload = function() { console.log(this.result); } reader.readAsArrayBuffer(blob);控制台輸出的則是ArrayBuffer的數據了。
ajax獲取
很多時候，往往需要前端向后端請求二進制數據，我們來對比下這兩者在ajax獲取中會有區別么？
先弄張圖片作為二進制來源，使用node的fs模塊就行了，
let file = fs.readFileSync('test.jpg');獲取arraybuffer的發送/arraybuffer請求，獲取blob的發送/blob請求，
if ('/arraybuffer' === req.url || '/blob' === req.url) { res.write(file); res.end(); }前端方面，利用原生的XMLHttpRequest發送請求，並設置responseType就行了，
xhr.responseType = 'arraybuffer'; xhr.responseType = 'blob';詳細的demo見：js中arraybuffer與blob的區別。
后端都是返回的二進制信息，而到了前端由於設置了type，瀏覽器自動轉化了類型，打印除了不同的結果。
總結
ArrayBuffer和Blob一樣，都是二進制數據的容器，而ArrayBuffer相比更為底層，他可以去操作去修改這些二進制值，這兩者之間也是可以互轉的。