前言

二進制是計算技術中廣泛采用的一種數制。二進制數據是用0和1兩個數碼來表示的數，如果想要在前端中處理音頻和視頻。那你必須要對二進制數據有很好地掌握和操作能力。下面話不多說了，來一起看看詳細介紹的吧

類型化數組的出現

類型化數組是 HTML5 中引入的API，它能夠讓開發者使用 JavaScript 直接操作二進制數據。在類型化數組出現之前，我們是無法直接通過 JavaScript 操作二進制數據，通常都是操作 JavaScript 中的數據類型，由運行時轉化成二進制。這就多了一個轉化的過程，盡管 JavaScript 對數據類型做了很多優化以提高效率，但相比直接操作二進制來說，仍然有效率上的差異。于是類型化數組就順勢推出了。

用途

那么，類型化數組的應用場景都有哪些呢？

• canvas 圖像處理。
• WebGL 與顯卡通信。
• 文件操作
• Ajax響應

如何使用

那么，既然類型化數組這么重要，那還等什么，趕緊來掌握它們吧。

既然我們要直接操作二進制數據，二進制數據又是存放在一段連續的內存區域中，所以我們首先要有這么一段內存區域。

我們可以創建一個內存區域：

let buffer = new ArrayBuffer()

ArrayBuffer 是一個構造函數，允許我們實例化數組緩沖區，數組緩沖區可以理解為是一段連續的內存區域。

由于我們構造函數傳入的參數是空，所以生成的 buffer 指向的內存長度是 0 字節，沒有意義。

嗯，那我們就創建一個有意義的內存區域。

buffer = new ArrayBuffer(8)

我們給ArrayBuffer 傳入參數 8，意思是讓瀏覽器幫我們創建一段 8 個字節長度的內存區域。

我們看下這段內存區域的長度是否是 8 個字節

console.log(buffer.byteLength);

輸出是 8， 看來瀏覽器沒有欺騙我們。

我們猜想這 8 個字節里面的值應該都是 0 ，因為我們并沒有給 buffer 賦值。讓我們確認一下吧，先看第一個字節：

console.log(buffer[0])

輸出： undefined。

咦？怎么是 undefined 呢？

哦，原來 buffer[0] 的意思是查看 buffer 這個對象 的屬性為 0 的值，因為 buffer 沒有 0 這個屬性，所以是 undefined。

好吧，看來我們查看 buffer 內容的姿勢不對。

那該如何查看 buffer 內容呢？

數組視圖