二進(jìn)制數(shù)組的由來(lái)

主要是為了提高瀏覽器與顯卡之間的通信效率，由二進(jìn)制數(shù)據(jù)代替?zhèn)鹘y(tǒng)的文本。

二進(jìn)制數(shù)組主要有三個(gè)對(duì)象：

• ArrayBuffer
• TypedArray
• DataView

ArrayBuffer對(duì)象

ArrayBuffer是一個(gè)構(gòu)造函數(shù)，參數(shù)是一個(gè)數(shù)字，代表索取多少個(gè)字節(jié)的內(nèi)存。例如：

var buffer = new ArrayBuffer(12);

代表生成12個(gè)字節(jié)的內(nèi)存區(qū)域。

注意：ArrayBuffer對(duì)象本身并不能直接對(duì)生成的內(nèi)存區(qū)域進(jìn)行讀寫(xiě)(除了slice方法)，需要借助視圖TypedArray和DataView來(lái)對(duì)其進(jìn)行讀寫(xiě)。

三個(gè)方法：

• 實(shí)例方法byteLength，返回生成內(nèi)存的字節(jié)大小
• 實(shí)例方法slice，這個(gè)方法和數(shù)組類似，就是生成一段新的內(nèi)存，并填充拷貝的內(nèi)容
• 靜態(tài)方法isView，是否是視圖

demo1

TypedArray的用法

這種類型的視圖總共有9種構(gòu)造函數(shù)：

• Int8Array 8位 有符號(hào) 一個(gè)字節(jié) 整數(shù)
• Uint8Array 8位 無(wú)符號(hào) 一個(gè)字節(jié) 整數(shù)
• Uint8ClampedArray 8位 無(wú)符號(hào) 一個(gè)字節(jié) 整數(shù)
• Int16Array 16位 有符號(hào) 兩個(gè)字節(jié) 整數(shù)
• Uint16Array 16位 無(wú)符號(hào) 兩個(gè)字節(jié) 整數(shù)
• Int32Array 32位 有符號(hào) 四個(gè)字節(jié) 整數(shù)
• Uint32Array 32位 無(wú)符號(hào) 四個(gè)字節(jié) 整數(shù)
• Float32Array 32位 四個(gè)字節(jié) 浮點(diǎn)數(shù)
• Float64Array 64位 八個(gè)字節(jié) 浮點(diǎn)數(shù)

用法1：

new TypedArray(buf, start, length)

• buf ArrayBuffer對(duì)象
• start開(kāi)始的位置，默認(rèn)是0
• length 字節(jié)的長(zhǎng)度 相對(duì)于這種數(shù)據(jù)類型的長(zhǎng)度

用法2：

new TypedArray(length)

直接傳入一個(gè)長(zhǎng)度，生成一段內(nèi)存區(qū)域

用法3：

new TypedArray(typedArray對(duì)象)

demo2

demo2中x和y視圖并沒(méi)有共享內(nèi)存，如果想共享視圖可以這樣(傳入實(shí)例的buffer屬性)：

demo3

用法4：

new TypedArray(普通的數(shù)組)

demo4

demo4中操作typedArray不會(huì)使aa發(fā)生變化，說(shuō)明它們沒(méi)有共用同一段內(nèi)存。

TypedArray的數(shù)值

二進(jìn)制數(shù)組采用小端字節(jié)序，數(shù)組前面的元素的位相對(duì)較低，越往后越高，比如demo5中32這個(gè)元素就沒(méi)有后面0的元素位高，轉(zhuǎn)化成16進(jìn)制應(yīng)該是0x0000000000000020，如果采用16位或者32位視圖，再對(duì)應(yīng)將其劃分。

demo5

小端字節(jié)序：低位在前，高位在后；

大端字節(jié)序：高位在前，低位在后；

TypedArray的數(shù)值溢出

什么是溢出呢？看下圖：

demo6

我們創(chuàng)建了一個(gè)Uint8Array視圖，它每一個(gè)元素的最大值是255(8位)，最小值是0，當(dāng)給定的數(shù)值不在這個(gè)區(qū)間內(nèi)時(shí)，就會(huì)發(fā)生溢出！從demo6中我們給第一個(gè)元素賦值5000，但顯示的卻是136，這種現(xiàn)象就叫做溢出。

那么溢出的規(guī)則是什么？經(jīng)過(guò)我的摸索得出了幾條規(guī)律！

無(wú)符號(hào)(先利用Uint8Array說(shuō)明)

Uint8Array最大值255(max)，最小值0(min)，區(qū)間長(zhǎng)度256(L)，給其一個(gè)元素賦值m，最終顯示的值是n(例子見(jiàn)demo7)

//無(wú)符號(hào)最小值都是0if(m >= min){ //正向溢出 n = m%L } if (m < min) { //負(fù)向溢出，m是負(fù)數(shù) n = L + m%L}

demo7

有符合(先利用Int8Array說(shuō)明)

Int8Array最大值127(max)，最小值-128(min)，區(qū)間長(zhǎng)度256(L)，給其一個(gè)元素賦值m，最終顯示的值是n(例子見(jiàn)demo8)

余數(shù)y = m%L//正向溢出(m是正數(shù))if (y <= max) { n = y} if (y > max) { n = y - L}//負(fù)向溢出(此時(shí)y，min都是負(fù)數(shù))if (y >= min) { n = y}if (y < min) { n = L + y}

demo8

DataView對(duì)象

DataView對(duì)象和TypedArray對(duì)象最大的區(qū)別是可以自定義大端字節(jié)序還是小端字節(jié)序！

用法：

var buf = new ArrayBuffer(n);var dv = new DataView(buf, 字節(jié)起始位置, 長(zhǎng)度);//查看demo6

demo9

8個(gè)get方法：

• getInt8：讀取1個(gè)字節(jié)，返回一個(gè)8位整數(shù)。
• getUint8：讀取1個(gè)字節(jié)，返回一個(gè)無(wú)符號(hào)的8位整數(shù)。
• getInt16：讀取2個(gè)字節(jié)，返回一個(gè)16位整數(shù)。
• getUint16：讀取2個(gè)字節(jié)，返回一個(gè)無(wú)符號(hào)的16位整數(shù)。
• getInt32：讀取4個(gè)字節(jié)，返回一個(gè)32位整數(shù)。
• getUint32：讀取4個(gè)字節(jié)，返回一個(gè)無(wú)符號(hào)的32位整數(shù)。
• getFloat32：讀取4個(gè)字節(jié)，返回一個(gè)32位浮點(diǎn)數(shù)。
• getFloat64：讀取8個(gè)字節(jié)，返回一個(gè)64位浮點(diǎn)數(shù)。

//使用樣例dv.getXX(第幾個(gè)字節(jié)，大端字節(jié)序(false)/小端字節(jié)序(true))

8個(gè)set方法：

• setInt8：寫(xiě)入1個(gè)字節(jié)的8位整數(shù)。
• setUint8：寫(xiě)入1個(gè)字節(jié)的8位無(wú)符號(hào)整數(shù)。
• setInt16：寫(xiě)入2個(gè)字節(jié)的16位整數(shù)。
• setUint16：寫(xiě)入2個(gè)字節(jié)的16位無(wú)符號(hào)整數(shù)。
• setInt32：寫(xiě)入4個(gè)字節(jié)的32位整數(shù)。
• setUint32：寫(xiě)入4個(gè)字節(jié)的32位無(wú)符號(hào)整數(shù)。
• setFloat32：寫(xiě)入4個(gè)字節(jié)的32位浮點(diǎn)數(shù)。
• setFloat64：寫(xiě)入8個(gè)字節(jié)的64位浮點(diǎn)數(shù)。

//使用樣例dv.setXX(第幾個(gè)字節(jié)，數(shù)據(jù), 大端字節(jié)序(false)/小端字節(jié)序(true))

總結(jié)

其實(shí)二進(jìn)制數(shù)組在平時(shí)工作中并不常用，甚至不常見(jiàn)，不過(guò)還是有必要了解一下的！因?yàn)樗莃uffer的基礎(chǔ)，所以在研究buffer之前先了解一下！因?yàn)楦鶕?jù)我的測(cè)試，自己摸索出了一個(gè)通用的規(guī)則，幫助大家理解，大家也可以幫我驗(yàn)證，大家有想法的也可以留言給我補(bǔ)充！

喜歡我的文章就關(guān)注我吧，有問(wèn)題可以發(fā)表評(píng)論，我們一起學(xué)習(xí)，共同成長(zhǎng)！

總結(jié)

以上是生活随笔為你收集整理的位域 内存 字节序_JS操作内存？二进制数组了解一下的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。