Array的push與unshift方法性能比較分析
更新時(shí)間:2011年03月05日 13:58:18 作者:
Array的push與unshift方法都能給當(dāng)前數(shù)組添加元素,不同的是,push是在末尾添加,而unshift則是在開頭添加。
從原理就可以知道,unshift的效率是較低的。原因是,它每添加一個(gè)元素,都要把現(xiàn)有元素往下移一個(gè)位置。但到底效率差異有多大呢?下面來測(cè)試一下。
測(cè)試環(huán)境的主要硬件:CPU T7100(1.8G);內(nèi)存4G DDR2 667;硬盤5400轉(zhuǎn)。主要軟件:操作系統(tǒng)為Windows 7;瀏覽器為Firefox 3.6.9。測(cè)試代碼:
var arr = [ ], s = +new Date;
// push性能測(cè)試
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
console.log(+new Date - s);
s = +new Date;
arr = [ ];
// unshift性能測(cè)試
for (var i = 0; i < 50000; i++) {
arr.unshift(i);
}
console.log(+new Date - s);
這段代碼分別執(zhí)行了50000次push和unshift操作,運(yùn)行一次以后,得出結(jié)果:
12
1152
可見,unshift比push要慢差不多100倍!因此,平時(shí)還是要慎用unshift,特別是對(duì)大數(shù)組。那如果一定要達(dá)到unshift的效果,有沒有其他方法呢?答案是肯定的。
Array有一個(gè)叫做reverse的方法,能夠把一個(gè)數(shù)組反轉(zhuǎn)。先把要放進(jìn)數(shù)組的元素用push添加,再執(zhí)行一次reverse,就達(dá)到了unshift的效果。比如:
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
reverse的性能又如何呢,下面再來測(cè)試:
var arr = [ ], s = +new Date;
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
console.log(+new Date - s);
結(jié)果是:
12
可見,reverse性能極高,甚至于沒有額外的消耗,可以放心使用。
測(cè)試環(huán)境的主要硬件:CPU T7100(1.8G);內(nèi)存4G DDR2 667;硬盤5400轉(zhuǎn)。主要軟件:操作系統(tǒng)為Windows 7;瀏覽器為Firefox 3.6.9。測(cè)試代碼:
復(fù)制代碼 代碼如下:
var arr = [ ], s = +new Date;
// push性能測(cè)試
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
console.log(+new Date - s);
s = +new Date;
arr = [ ];
// unshift性能測(cè)試
for (var i = 0; i < 50000; i++) {
arr.unshift(i);
}
console.log(+new Date - s);
這段代碼分別執(zhí)行了50000次push和unshift操作,運(yùn)行一次以后,得出結(jié)果:
12
1152
可見,unshift比push要慢差不多100倍!因此,平時(shí)還是要慎用unshift,特別是對(duì)大數(shù)組。那如果一定要達(dá)到unshift的效果,有沒有其他方法呢?答案是肯定的。
Array有一個(gè)叫做reverse的方法,能夠把一個(gè)數(shù)組反轉(zhuǎn)。先把要放進(jìn)數(shù)組的元素用push添加,再執(zhí)行一次reverse,就達(dá)到了unshift的效果。比如:
復(fù)制代碼 代碼如下:
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
reverse的性能又如何呢,下面再來測(cè)試:
復(fù)制代碼 代碼如下:
var arr = [ ], s = +new Date;
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
console.log(+new Date - s);
結(jié)果是:
12
可見,reverse性能極高,甚至于沒有額外的消耗,可以放心使用。
相關(guān)文章
Element Plus UI 組件庫(kù)中 mt-x 類詳解
在ElementPlusUI組件庫(kù)中,mt-x類用于設(shè)置元素的外邊距,其中"mt"代表"margin-top",x表示外邊距的大小,這種類名的使用可以快速調(diào)整元素的頂部外邊距,簡(jiǎn)化樣式管理,確保設(shè)計(jì)的一致性,本文給大家介紹Element Plus UI 組件庫(kù)中 mt-x 類基本知識(shí),感興趣的朋友一起看看吧2024-11-11
javascript設(shè)計(jì)模式 封裝和信息隱藏(上)
今天博文關(guān)注的是javascript中的封裝,文章內(nèi)容來自《pro javascript design patterns》(有興趣的朋友可以直接去下)和自己對(duì)這一問題的理解2012-07-07
JS小數(shù)運(yùn)算出現(xiàn)多為小數(shù)問題的解決方法
這篇文章主要介紹了JS小數(shù)運(yùn)算出現(xiàn)多為小數(shù)問題的解決方法,需要的朋友可以參考下2016-06-06
JavaScript 中問號(hào)的三種用法 ??和?.以及?:
本文主要介紹了JavaScript 中問號(hào)的三種用法 ??和?.以及?: ,分別是空值合并操作符、可選鏈操作符和三目運(yùn)算,具有一定的參考價(jià)值,感興趣的可以了解一下2025-04-04
使用ionic(選項(xiàng)卡欄tab) icon(圖標(biāo)) ionic上拉菜單(ActionSheet) 實(shí)現(xiàn)通訊錄界面切換實(shí)例
這篇文章主要介紹了使用ionic(選項(xiàng)卡欄tab) icon(圖標(biāo)) ionic上拉菜單(ActionSheet) 實(shí)現(xiàn)通訊錄界面切換實(shí)例代碼,需要的朋友可以參考下2017-10-10
利用原生JS自動(dòng)生成文章標(biāo)題樹的實(shí)例
網(wǎng)上關(guān)于生成文章標(biāo)題樹的示例很多,這篇文章介紹的是利用原生JS實(shí)現(xiàn)自動(dòng)生成文章標(biāo)題樹,實(shí)現(xiàn)過程很簡(jiǎn)單,有需要的可以參考借鑒。2016-08-08

