[TOC] # 20.1 概述 類型化數組（Typed Arrays）是一個用于處理二進制數據的 ECMAScript 6 的 API。 代碼示例： ```js const typedArray = new Uint8Array([0]) console.log(typedArray) // 3 typedArray[0] = 5 const normalArray = [...typedArray] // [5,1,2] // The elements are stored in typedArray.buffer. // Get a different view on the same data: const dataView = new DataView(typedArray.buffer) console.log(dataView.getUint8(0)) // 5 ``` ArrayBuffer 實例 存儲要處理的二進制數據。 兩種*views* 用于訪問數據： - 類型化數組（ `Uint8Array`， `Int16Array`， `Float32Array` 等）將 ArrayBuffer 解釋為單個類型的元素的索引序列。 - `DataView` 實例允許您在 ArrayBuffer 內的任何字節偏移處（ any byte offset）訪問數據為多種類型（ `Uint8` ， `Int16` ， `Float32` 等）的元素。 以下瀏覽器 API 支持 Typed Arrays（ [詳細信息](http://exploringjs.com/es6/ch_typed-arrays.html#sec_browser-apis-supporting-typed-arrays)在專門章節中提到）： - File API - XMLHttpRequest - Fetch API - Canvas - WebSockets - And more # 20.2 簡介 在 web 上遇到的很多數據都是文本:JSON 文件、HTML 文件、CSS 文件、JavaScript 代碼等等。為了處理這些數據，JavaScript 的內置字符串數據類型運行良好。 然而，一直到幾年前，JavaScript 都沒有能力處理二進制數據。 2011 年 2 月 8 日， [Typed Array Specification 1.0](https://www.khronos.org/registry/typedarray/specs/1.0/) 標準化了處理二進制數據的工具。 到目前為止，各種引擎都[很好地支持](http://caniuse.com/#feat=typedarrays) Typed Arrays。 通過 ECMAScript 6，它們成為了核心語言的一部分，并在這個過程中獲得了許多以前只能用于數組(`map()`、`filter()`等)的方法。 Typed Arrays 的主要用例是： - 處理二進制數據：在 HTML Canvas 元素中處理圖像數據，解析二進制文件，處理二進制網絡協議等。 - 與本機 API 交互：本機 API 通常以二進制格式接收和返回數據，您無法在傳統 JavaScript 中存儲或操作它們。 這意味著無論何時與這樣的 API 進行通信，每次調用時都必須將數據從 JavaScript 轉換為二進制并返回。 Typed Arrays 消除了這個瓶頸。 與本機 API 通信的一個示例是 WebGL，最初為其創建了 Typed Arrays。 “ [Typed Arrays：瀏覽器中的二進制數據](http://www.html5rocks.com/en/tutorials/webgl/typed_arrays/#toc-history) ”（由 Ilmari Heikkinen 發表在 HTML5 Rocks 上）文章的“ Typed Arrays ”部分提供了更多詳細的介紹。 在類型化數組 API 中，兩種對象一起工作 - 緩沖區： ArrayBuffer 實例保存二進制數據。 - 視圖：提供訪問二進制數據的方法。 有兩種觀點： - 類型數組構造函數(`Uint8Array`、`Float64Array` 等)的實例與普通數組的工作方式非常相似，但只允許其元素使用單一類型，并且沒有漏洞。 - `DataView` 的一個實例允許您訪問緩沖區中任何字節偏移量的數據，并將該數據解釋為幾種類型(`Uint8`、`Float64` 等)之一。 這是 Typed Array 的 API 的結構圖（值得注意的是：所有 Typed Arrays 都有一個共同的超類（superclass））：  ### 20.2.1 Element types