實例

首先我們來看看下面這兩段代碼，兩段代碼都是在初始化一個長度為1億的數(shù)組，唯一區(qū)別是在片段二中，先為最后一項賦值1次，大家覺得會有區(qū)別嗎？

代碼一：

const arr1 = [];
for ( let i = 0; i < 100000000; ++i ) {
  arr1[i] = 1;
}

代碼二：

const arr2 = [];
arr2[100000000 - 1] = 1;
for ( let i = 0; i < 100000000; ++i ) {
  arr2[i] = 1;
}

我們來嘗試執(zhí)行一下：

可以看到片段二比片段一要耗時多出許多，片段一的耗時是318毫秒，片段二的耗時是1343毫秒，中間僅僅因為片段二先為最后一項賦值了1次。

片段二之所以會多出這部分的耗時，歸根結(jié)底是因為v8會以不同的形式去存儲js的數(shù)組。

第一種模式是快速模式，V8對應用c語言的數(shù)組來對js的數(shù)組進行存儲，具備速度快，緊湊的特點。

第二種模式是字典模式，v8 對應用c語言的哈希表來對js的數(shù)組進行存儲，特點是速度慢松散。

兩種模式的觸發(fā)機制

如果數(shù)組從首位到最后一位是緊湊的，中間無空洞；或者預分配給數(shù)組的大小，小于10萬，無論中間有沒有空洞，都會進入快速模式。

但是如果預分配給數(shù)組的大小，大于等于10萬，且中間有空洞，這樣就會把數(shù)組進入字典模式。

我們再回到最開始的例子：

例子的邏輯是，首先我們定義一個數(shù)組，再為數(shù)組的最后一位賦1，在這個時候，這個數(shù)組已經(jīng)具備了一定的長度，而且這個長度是大于10萬的，而且這個數(shù)組中間是有非常多的空洞，只有最后一位有數(shù)字。這就意味著在這段片段里面執(zhí)行完之后，數(shù)組就會在v8里面去進入了字典模式，而字典模式的特點是松散，而且執(zhí)行相對比較慢，就會導致前面的一段時間耗時會多出許多，這就是底層的原因。

優(yōu)化策略：

從0開始連續(xù)的初始化數(shù)組，以避免數(shù)組進入字典模式。

不要預分配一個超大數(shù)組 (比如長度大于等于 100000)

刪除數(shù)組元素時讓數(shù)組保持緊湊，盡可能避免使用 delete。

不要訪問未初始化或已刪除的數(shù)組元素。

以上就是js性能優(yōu)化之數(shù)組模式實例詳解的詳細內(nèi)容，更多關(guān)于js性能優(yōu)化數(shù)組模式的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論