区别:
1、数组里面可以放数字、字符串、布尔值以及对象和数组等,ArrayBuffer放0和1组成的二进制数据
2、数组放在堆中,ArrayBuffer则把数据放在栈中(所以取数据时后者快)
3、ArrayBuffer初始化后固定大小,数组则可以自由增减。
ArrayBuffer
ArrayBuffer又称类型化数组。类型化数组是JavaScript操作二进制数据的一个接口。最初为了满足JavaScript与显卡之间大量的、实时的数据交换,它们之间的数据通信必须是二进制的
类型化数组是建立在ArrayBuffer对象的基础上的。它的作用是,分配一段可以存放数据的连续内存区域。
1
| var bf = new ArrayBuffer(40);
|
3
| console.log(bf.byteLength);
|
ArrayBuffer对象有一个slice方法,允许将内存区域的一部分,拷贝生成一个新的ArrayBuffer对象。
1
| const bf = new ArrayBuffer(40);
|
2
| const newBf = bf.slice(0, 10);
|
· 上面代码拷贝buffer对象的前10个字节,生成一个新的ArrayBuffer对象。slice方法其实包含两步,第一步是先分配一段新内存,第二步是将原来那个ArrayBuffer对象拷贝过去。
· slice方法接受两个参数,第一个参数表示拷贝开始的字节序号,第二个参数表示拷贝截止的字节序号。如果省略第二个参数,则默认到原ArrayBuffer对象的结尾。
· 除了slice方法,ArrayBuffer对象不提供任何直接读写内存的方法,只允许在其上方建立视图,然后通过视图读写。
ArrayBuffer作为内存区域,可以存放多种类型的数据。不同数据有不同的存储方式,这就叫做“视图”。
JavaScript提供以下类型的视图:
Int8Array:8位有符号整数,长度1个字节。
Uint8Array:8位无符号整数,长度1个字节。
Int16Array:16位有符号整数,长度2个字节。
Uint16Array:16位无符号整数,长度2个字节。
Int32Array:32位有符号整数,长度4个字节。
Uint32Array:32位无符号整数,长度4个字节。
Float32Array:32位浮点数,长度4个字节。
Float64Array:64位浮点数,长度8个字节。
每一种视图都有一个BYTES_PER_ELEMENT常数,表示这种数据类型占据的字节数。
1
| Int8Array.BYTES_PER_ELEMENT
|
2
| Uint8Array.BYTES_PER_ELEMENT
|
每一种视图都是一个构造函数,有多种方法可以生成:
3
| > function Int32Array() { [native code] }
|
在ArrayBuffer对象之上生成视图
同一个ArrayBuffer对象之上,可以根据不同的数据类型,建立多个视图。
02
| var b = new ArrayBuffer(8);
|
05
| var v1 = new Int32Array(b);
|
08
| var v2 = new Uint8Array(b, 2);
|
11
| var v3 = new Int16Array(b, 2, 2);
|
上面代码在一段长度为8个字节的内存(b)之上,生成了三个视图:v1、v2和v3。视图的构造函数可以接受三个参数:
第一个参数:视图对应的底层ArrayBuffer对象,该参数是必需的。
第二个参数:视图开始的字节序号,默认从0开始。
第三个参数:视图包含的数据个数,默认直到本段内存区域结束。
注意:v1、v2和v3是重叠:v1[0]是一个32位整数,指向字节0~字节3;v2[0]是一个8位无符号整数,指向字节2;v3[0]是一个16位整数,指向字节2~字节3。只要任何一个视图对内存有所修改,就会在另外两个视图上反应出来。
直接生成
视图还可以不通过ArrayBuffer对象,直接分配内存而生成。
1
| var f64a = new Float64Array(8);
|
4
| f64a[2] = f64a[0] + f64a[1];
|
上面代码生成一个8个成员的Float64Array数组(共64字节),然后依次对每个成员赋值。这时,视图构造函数的参数就是成员的个数。可以看到,视图数组的赋值操作与普通数组的操作毫无两样。
来自 http://www.5imoban.net/jiaocheng/jquery/202009043949.html
http://www.5imoban.net/jiaocheng/jquery/202009043949.html
ArrayBuffer是JavaScript用来处理二进制的,ArrayBuffer对象保存着原始二进制数据,它不能对数据进行操作,
只能通过视图类(TypeArray或DataView)才能对数据进行读写。
ArrayBuffer特点:
1.数组里面存放的是二进制原始数据01,以字节为单位,一个字节8位
2.初始化后固定大小
//创建了2个字节的ArrayBuffer 数据默认:0000 0000 | 0000 0000
var buffer = new ArrayBuffer(2);
console.log(buffer.byteLength);
方法及属性:
byteLength //readonly 只读属性,缓存数据的长度,可以体现改buffer申请了多大的内存空间
slice(start, end?);//返回一个新的buffer,end默认到最后
ArrayBuffer.isView(typeArray);//静态方法,判断是否是typeArray 或者 DataView, 返回boolen值
var buffer = new ArrayBuffer(8);
var int8a = new Int8Array(buffer);
console.log('buffer byte length: ', buffer.byteLength);
console.log('new8int : ', newInt8a[0]);
//从buffer中slice一个新的buffer
var newBuffer = buffer.slice(2);
var newInt8a = new Int8Array(newBuffer);
console.log('newBuffer byte length: ', newBuffer.byteLength);
console.log('new8int : ', newInt8a[0]);
console.log(ArrayBuffer.isView(int8a));
字节说明:
一字节:8位,可以表示2^8=256种状态,如果是int8类型可以表示-128到127(1000 0000 - 0111 1111)如果是uint8类型则可以表示0到255(0000 0000 - 1111 1111)
四字节:32位,可以表示2^32=4294967296种状态,如果是int32类型可以表示-2^16到2^16-1(1000 0000 0000 0000 - 0111 1111 1111 1111) ,uint32 为(0-0111 1111 1111 1111)
位和字节单位换算:
1Byte(字节) = 8bit(位)
1024Byte(字节) = 1k
1024KB = 1MB;
1024MB = 1GB;
1024GB = 1TB;
下一篇继续说如果使用typeArray读取和改写ArrayBuffer
来自 https://blog.csdn.net/xiaye_go/article/details/87168781
https://wenku.baidu.com/view/6e1e6d68fd4733687e21af45b307e87101f6f878.html