book/es6tutorial
1
0
Fork 0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-25 03:02:21 +00:00
Code Issues Releases Wiki Activity

edit arraybuffer

Browse Source
This commit is contained in:
ruanyf 2015-10-01 21:49:31 +08:00
parent f86ef7d9df
commit f54bda7426
2 changed files with 20 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
docs/arraybuffer.md
View File

@ -2,19 +2,21 @@
ArrayBuffer对象、TypedArray对象、DataView对象是JavaScript操作二进制数据的一个接口。这些对象早就存在，属于独立的规格，ES6将它们纳入了ECMAScript规格，并且增加了新的方法。 ArrayBuffer对象、TypedArray对象、DataView对象是JavaScript操作二进制数据的一个接口。这些对象早就存在，属于独立的规格，ES6将它们纳入了ECMAScript规格，并且增加了新的方法。
这些对象原始的设计目的，要从WebGL项目的诞生说起。所谓WebGL，就是指浏览器与显卡之间的通信接口，为了满足JavaScript与显卡之间大量的、实时的数据交换，它们之间的数据通信必须是二进制的，而不能是传统的文本格式。文本格式传递一个32位整数，两端的JavaScript脚本与显卡都要进行格式转化，将非常耗时。这时要是存在一种机制，可以像C语言那样，直接操作字节，将4个字节的32位整数，以二进制形式原封不动地送入显卡，脚本的性能就会大幅提升。 这些对象原始的设计目的，与WebGL项目有关。所谓WebGL，就是指浏览器与显卡之间的通信接口，为了满足JavaScript与显卡之间大量的、实时的数据交换，它们之间的数据通信必须是二进制的，而不能是传统的文本格式。文本格式传递一个32位整数，两端的JavaScript脚本与显卡都要进行格式转化，将非常耗时。这时要是存在一种机制，可以像C语言那样，直接操作字节，将4个字节的32位整数，以二进制形式原封不动地送入显卡，脚本的性能就会大幅提升。
`ArrayBuffer`等对象就是在这种背景下诞生的。它很像C语言的数组，允许开发者以数组下标的形式，直接操作内存。它们大大增强了JavaScript处理二进制数据的能力，使得开发者有可能通过JavaScript与操作系统的原生接口进行二进制通信。 二进制数组就是在这种背景下诞生的。它很像C语言的数组，允许开发者以数组下标的形式，直接操作内存，大大增强了JavaScript处理二进制数据的能力，使得开发者有可能通过JavaScript与操作系统的原生接口进行二进制通信。
ArrayBuffer对象与TypedArray对象、DataView对象的区别是：前者代表底层数据，不区分类型；后两者代表上层视图，具有类型。 二进制数组由三个对象组成。
- ArrayBuffer对象：代表内存的一段二进制数据，可以通过“视图”进行操作。各种“视图”具有数组接口，可以用数组的方法操作内存。 **（1）ArrayBuffer对象**：代表内存之中的一段二进制数据，可以通过“视图”进行操作。“视图”部署了数组接口，这意味着，可以用数组的方法操作内存。
- TypedArray对象：提供多个构造函数，用来生成不同类型的视图，比如`Uint8Array`（无符号8位整数）数组视图, `Int16Array`（16位整数）数组视图, `Float32Array`（32位浮点数）数组视图等等。
- DataView对象：可以自定义字节序，解读同一段内存，比如Uint8（无符号8位整数）、Int16（16位整数）、Float32（32位浮点数）等等。
ArrayBuffer对象的视图支持以下数据类型。 **（2) TypedArray对象**：用来生成内存的视图，通过9个构造函数，可以生成9种数据格式的视图，比如`Uint8Array`（无符号8位整数）数组视图, `Int16Array`（16位整数）数组视图, `Float32Array`（32位浮点数）数组视图等等。
数据类型|字节长度|含义|对应的C语言类型 **（3）DataView对象**：用来生成内存的视图，可以自定义格式和字节序，比如第一个字节是Uint8（无符号8位整数）、第二个字节是Int16（16位整数）、第三个字节是Float32（32位浮点数）等等。
简单说，ArrayBuffer对象代表原始的二进制数据，TypedArray对象代表确定类型的二进制数据，DataView对象代表不确定类型的二进制数据。它们支持的数据类型一共有9种（DataView对象支持除`Uint8C`以外的其他8种）。
数据类型 | 字节长度 | 含义 | 对应的C语言类型
--------|--------|----|--------------- --------|--------|----|---------------
Int8|1|8位带符号整数|signed char Int8|1|8位带符号整数|signed char
Uint8|1|8位不带符号整数|unsigned char Uint8|1|8位不带符号整数|unsigned char
@ -26,7 +28,7 @@ Uint32|4|32位不带符号的整数|unsigned int
Float32|4|32位浮点数|float Float32|4|32位浮点数|float
Float64|8|64位浮点数|double Float64|8|64位浮点数|double
很多浏览器的API使用ArrayBuffer对象，操作二进制数据，下面是其中的几个。 很多浏览器操作的API，用到了二进制数组操作二进制数据，下面是其中的几个。
- File API - File API
- XMLHttpRequest - XMLHttpRequest
@ -38,7 +40,7 @@ Float64|8|64位浮点数|double
### 概述 ### 概述
`ArrayBuffer`对象代表储存二进制数据的一段内存，它不能直接读写，只能通过视图（`TypedArray`视图和`DataView`视图)来读写。视图的作用是以指定格式解读二进制数据。 `ArrayBuffer`对象代表储存二进制数据的一段内存，它不能直接读写，只能通过视图（`TypedArray`视图和`DataView`视图)来读写，视图的作用是以指定格式解读二进制数据。
`ArrayBuffer`也是一个构造函数，可以分配一段可以存放数据的连续内存区域。 `ArrayBuffer`也是一个构造函数，可以分配一段可以存放数据的连续内存区域。

6
index.html
View File

@ -30,9 +30,9 @@
<script> <script>
// essential settings // essential settings
ditto.index = "README.md", ditto.index = "README.md";
ditto.sidebar_file = "sidebar.md", ditto.sidebar_file = "sidebar.md";
ditto.document_title = "ECMAScript 6入门", ditto.document_title = "ECMAScript 6入门";
// where the docs are actually stored on github - so you can edit // where the docs are actually stored on github - so you can edit
ditto.base_url = "https://github.com/ruanyf/es6tutorial/edit/gh-pages"; // <------- EDIT ME!! ditto.base_url = "https://github.com/ruanyf/es6tutorial/edit/gh-pages"; // <------- EDIT ME!!