typed array

JS里的Array，因为有很多功能，而且是不限制类型的，或者它还可能是稀疏的……总之这个Array是“托管”的，它内部有比较复杂的实现。而如果你从XHR、File API、Canvas等等各种地方，读取了一大串字节流，如果用JS里的Array去存，又浪费，又低效。于是为了配合这些新的API增强JS的二进制处理能力，就有了ArrayBuffer。

javascript里引入了arraybuffer的概念，arraybuffer像c语言里的malloc方法，开辟一片原始的内存空间，你也会把它转换成unsigned_int32或者int16这些你需要的实际类型的数组/指针来用。这就是typedArray的作用。

使用方法

名称

大小 (以字节为单位)

说明

Int8Array

1

8位有符号整数

Uint8Array

1

8位无符号整数

Int16Array

2

16位有符号整数

Uint16Array

2

16位无符号整数

Int32Array

4

32位有符号整数

Uint32Array

4

32位无符号整数

Float32Array

4

32位浮点数

Float64Array

8

64位浮点数

多个类型数组视图可以指向同一个arrayBuffer，采用不同的类型、不同的长度以及不同的位移。例如下面的代码：

// 创建一个8字节的ArrayBuffer  
var b = new ArrayBuffer(8);  
  
// 创建一个指向b的视图v1，采用Int32类型，开始于默认的字节索引0，直到缓冲区的末尾  
var v1 = new Int32Array(b);  
  
// 创建一个指向b的视图v2，采用Uint8类型，开始于字节索引2，直到缓冲区的末尾  
var v2 = new Uint8Array(b, 2);  
  
// 创建一个指向b的视图v3，采用Int16类型，开始于字节索引2，长度为2  
var v3 = new Int16Array(b, 2, 2);

此时对v1,v2,v3进行操作都会影响同一片内存，即会互相影响

var b = new ArrayBuffer(2);
var v2 = new Int8Array(b,1);
var v3 = new Int16Array(b);
v2[0]=1;
console.log(v3);//[256]

使用场景

你画我猜游戏，将canvas图像和二进制之间进行转换。

首先将在canvas上画好的图转化为二进制格式发送给服务器，由服务器转发给其他客户端然后转化为相应的png图片。采用这种方式发送图像数据比起base64编码来更有效率(数据小33%)