JavaScript中的ArrayBuffer是什么

一、JavaScript中的栈和堆

先简单说说JavaScript中的数据类型，主要分为两种，一种是值类型，一种是引用类型，常见的引用类型有Objact, Array， 如果数组中的元素是Nurmber， String之类的值类型会直接被压入栈中， 而引用类型只会压入对应的一个索引

 

 

 

指针就是指向对象和数组的一个索引，并不等于真正的这个对象和数组

 

 

因为arr是数组，是引用类型，str仅仅是从arr堆内存中获取的一个数据值，并保存在栈中，是直接在栈中修改，并且不能指向arr堆内存中。

二、那么ArrayBuffer到底是什么呢？

1、ArrayBuffer又称类型化数组，是一个二进制数据的原始缓存区，无法直接读取或者写入（也就是说只能存放0,1并且不能直接修改和读取）

2、数组是放在堆中，ArrayBuffer数组则把数据放在栈中（所以取数据时后者快）

3、可以根据需要传递类型化数组或者DataView对象来解释原始缓存区

4、ArrayBuffer初始化后固定大小，数组则可以自由增减。

类型化数组有以下几种：

    名称                     占用字节                                   描述

Int8Array                        1                            8位二补码有符号整数

Uint8Array                      1                                8位无符号整数

Uint8ClampedArray        1                    8位无符号整型固定数组(数值在0~255之间)

Int16Array                       2                            16位二补码有符号整数

Uint16Array                     2                                16位无符号整数

Int32Array                       4                            32 位二补码有符号整数

Uint32Array                     4                                32 位无符号整数

Float32Array                   4                                32 位 IEEE 浮点数

Float64Array                   8                                64 位 IEEE 浮点数

 

 

如上：首先分配了32字节的空间，in8使用Int8Array类型从0开始4个数据，每个数据占1个字节，所以A视图一共占用了2(0-2)个字节，后面的以此类推，最后留给in16空间有6字节，如果传入的length为超过6字节，那么就超出了所分配内存的范围而报错。

---

 

 

 如上：前四个属性都是只读的：

　    buffer　　　　  返回ArrayBuffer的引用

　　byteLength　　返回字节长度

　　byteOffset　 　返回视图在该ArrayBuffer中占用内存区域的起点位置

　　length　　　　 返回视图数据的个数

　　set()　　　　   第一个参数为已有的视图或者数组，第二个参数代表从第几个字节开始设置值

　　subarray　　   返回一个新的视图，如果第二个参数省略，则取剩余的全部

entries和keys两个方法目前仅在chrome和FireFox上面支持，返回一个数组迭代对象，你可以通过该对象的next()方法依次取得相应的值，或者使用for...of循环进行迭代。

在写这篇随便的时候，我查看了Mozilla开发者网络实际上这几种视图类型的原型TypedArray还有很多方法，诸如join、indexOf、forEach、map等，但可惜其他浏览器并不支持，或许将来会有所改善。

三、DataView视图

为了解决各种硬件设备、数据传输等对默认字节序的设定不一而导致解码时候会发生的混乱问题，javascript提供了DataView类型的视图来让开发者在对内存进行读写时手动设定字节序的类型。

1、DataView构造函数

 

 

2、DataView实例化后的对象所具有的功能

 

 

new DataView(buffer).setInt16(byteOffset ,value , [ littleEndian])

byteOffset 表示从内存的哪个字节开始

value          该对应字节将被设置的值

littleEndian  字节序，true为小端字节序，false或者不填为大端字节序

值得注意的是，在DataView视图中，读写超出其实例化时的范围的值时，都会发生错误，这跟之前的固定类型的视图不一样，在使用时更加谨慎

四、ArrayBuffer与字符串

javascript的字符串使用UTF-16编码的方式，所以我们可以这样来做：

 

 

var buffer = new ArrayBuffer(str.length * 2);

因为每个字母占两个字节所以总字节为length乘2
str.charCodeAt(i)把括号里的字符转成Unicode编码

小结

本篇文章主要写的是前端获取ArrayBuffer数据的方法，以及使用，写的时候发现自己还是有很多没搞懂的地方，虽然查了一些资料，但是可能还是错误的地方，希望发现的大家可以指出。

转载于:https://www.cnblogs.com/dxl395/p/11277858.html