乐趣区

关于javascript:定型数组的一些理解

jiezi

概念

定型数组所指的其实是一种非凡的蕴含数值类型的数组。不便咱们将数据以二进制模式存到内存中，并提供读取办法

前置常识

ArrayBuffer

ArrayBuffer 是所有定型数组及视图援用的根本单位 

var buffer = new ArrayBuffer(2);
buffer.byteLength//2，buffer 的字节数
var buffer1 = buffer.slice(1)// 截取 buffer
buffer1.byteLength//1
1、申明的 ArrayBuffer 会将所有二进制位初始为 0
2、ArrayBuffer 能够被垃圾回收，不需手动革除

ElementType

DataView

DataView 是第一种操作 ArrayView 的工具 

var buffer = new ArrayBuffer(2)
var view = new DataView(buffer);
view.byteOffset//0
view.byteLength//2
var view1 = new DataView(buffer,1,1);
view1.byteOffset//1
view1.byteLength//1

赋值和取值 

var buffer = new ArrayBuffer(2)
var view = new DataView(buffer);
view.setUint8(0,1)
view.getUint8(0);//1
view.getUint8(1);//0

字节序

在取值和赋值办法中默认都是安照字节的失常程序来的，而当咱们最初一个参数指定为 true 就是倒着存, 倒着取了 

var buffer = new ArrayBuffer(2)
var view = new DataView(buffer);
view.setUint16(0,1)//00000000  00000001  
view.getUint16(0,true)//(00000001 00000000)-> 256, 字节序反了
view.setUint16(0,1,true)//00000001 00000000  
view.getUint16(0,1)//256

溢出问题 

var buffer = new ArrayBuffer(2)
var view = new DataView(buffer);
view.setUint8(0,256)
view.getUint8(0)//0，从低位数开始取，疏忽超出的高位数
view.setUint8(2,1)// 超出 length,RangeError

定型数组

与 DataView 一样，定型数组也能够操作 ArrayBuffer，然而它继承了 Array 中许多办法，能够更加不便的操作 ArrayBuffer

var buffer = new ArrayBuffer(2)
var array = new Uint16Array(buffer)
console.log(array.length);//1
console.log(array.buffer===buffer);//true
var array1 = new Uint16Array(array)// 调配新的缓存，深拷贝
var array2 = array.slice(0,1)// 调配新的缓存，深拷贝
array = Uint16Array.of(1,2,3) // 长度为 3，值为 1，2，3
array = Uint16Array.from([1,2,3]) // 长度为 3，值为 1，2，3
array[0]// 取值
array[0]=2// 赋值

set 办法

set 办法用来在指定地位处填充数据 

var buffer = new ArrayBuffer(4)
var array = new Uint16Array(buffer)
array.set([1,2],0)//[1,2]

subarray 办法

subarray 依据开始索引和完结索引返回定型数组的子数组 

var buffer = new ArrayBuffer(4)
var array = new Uint16Array(buffer)
array.set([1,2],0)//[1,2]
var sub = array.subarray(0,1)//Uint16Array [1]
sub[0]=2
console.log(array)//Uint16Array [2,2],array 随之扭转

溢出问题

和 DataView 一样，从低位数开始取，疏忽超出的高位数

Blob 与 ArrayBuffer 的相互转换 

var buffer = new ArrayBuffer(1);
var arrayBuffer = new Uint16Array([1,2])
var b = new Blob([buffer,arrayBuffer])//ArrayBuffer 转换为 Blob
console.log(b)//Blob {size: 5, type: ""}
var reader = new FileReader();
reader.onloadend = function(){console.log(this.result)//ArrayBuffer(5)
}
reader.readAsArrayBuffer(b)//Blob 转换为 ArrayBuffer
退出移动版