Array的push與unshift方法性能比較分析
更新時間：2011年03月05日 13:58:18 作者：
Array的push與unshift方法都能給當前數(shù)組添加元素，不同的是，push是在末尾添加，而unshift則是在開頭添加。
從原理就可以知道，unshift的效率是較低的。原因是，它每添加一個元素，都要把現(xiàn)有元素往下移一個位置。但到底效率差異有多大呢？下面來測試一下。
測試環(huán)境的主要硬件：CPU T7100（1.8G）；內(nèi)存4G DDR2 667；硬盤5400轉(zhuǎn)。主要軟件：操作系統(tǒng)為Windows 7；瀏覽器為Firefox 3.6.9。測試代碼：
var arr = [ ], s = +new Date;
// push性能測試
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
console.log(+new Date - s);
s = +new Date;
arr = [ ];
// unshift性能測試
for (var i = 0; i < 50000; i++) {
arr.unshift(i);
}
console.log(+new Date - s);
這段代碼分別執(zhí)行了50000次push和unshift操作，運行一次以后，得出結(jié)果：
12
1152
可見，unshift比push要慢差不多100倍！因此，平時還是要慎用unshift，特別是對大數(shù)組。那如果一定要達到unshift的效果，有沒有其他方法呢？答案是肯定的。
Array有一個叫做reverse的方法，能夠把一個數(shù)組反轉(zhuǎn)。先把要放進數(shù)組的元素用push添加，再執(zhí)行一次reverse，就達到了unshift的效果。比如：
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
reverse的性能又如何呢，下面再來測試：
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性能極高，甚至于沒有額外的消耗，可以放心使用。
測試環(huán)境的主要硬件：CPU T7100（1.8G）；內(nèi)存4G DDR2 667；硬盤5400轉(zhuǎn)。主要軟件：操作系統(tǒng)為Windows 7；瀏覽器為Firefox 3.6.9。測試代碼：
復制代碼 代碼如下:
var arr = [ ], s = +new Date;
// push性能測試
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
console.log(+new Date - s);
s = +new Date;
arr = [ ];
// unshift性能測試
for (var i = 0; i < 50000; i++) {
arr.unshift(i);
}
console.log(+new Date - s);
這段代碼分別執(zhí)行了50000次push和unshift操作，運行一次以后，得出結(jié)果：
12
1152
可見，unshift比push要慢差不多100倍！因此，平時還是要慎用unshift，特別是對大數(shù)組。那如果一定要達到unshift的效果，有沒有其他方法呢？答案是肯定的。
Array有一個叫做reverse的方法，能夠把一個數(shù)組反轉(zhuǎn)。先把要放進數(shù)組的元素用push添加，再執(zhí)行一次reverse，就達到了unshift的效果。比如：
復制代碼 代碼如下:
for (var i = 0; i < 50000; i++) {
arr.push(i);
}
arr.reverse();
reverse的性能又如何呢，下面再來測試：
復制代碼 代碼如下:
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)文章
在ElementPlusUI組件庫中,mt-x類用于設(shè)置元素的外邊距,其中"mt"代表"margin-top",x表示外邊距的大小,這種類名的使用可以快速調(diào)整元素的頂部外邊距,簡化樣式管理,確保設(shè)計的一致性,本文給大家介紹Element Plus UI 組件庫中 mt-x 類基本知識,感興趣的朋友一起看看吧2024-11-11
javascript設(shè)計模式 封裝和信息隱藏（上）
今天博文關(guān)注的是javascript中的封裝，文章內(nèi)容來自《pro javascript design patterns》（有興趣的朋友可以直接去下）和自己對這一問題的理解2012-07-07
JS小數(shù)運算出現(xiàn)多為小數(shù)問題的解決方法
這篇文章主要介紹了JS小數(shù)運算出現(xiàn)多為小數(shù)問題的解決方法,需要的朋友可以參考下2016-06-06
今天在項目碰到一個問題，之前在項目首頁實現(xiàn)單列表的顯示和隱藏，通過wx:if判斷就可實現(xiàn)，現(xiàn)在要實現(xiàn)多列表的單項顯示和隱藏功能應該如何實現(xiàn)呢？下面小編給大家?guī)砹宋⑿判〕绦蛑嗔斜淼娘@示和隱藏功能，感興趣的朋友一起看看吧2018-08-08
今天小編就為大家分享一篇layui的table單擊行勾選checkbox功能方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
本文主要介紹了JavaScript 中問號的三種用法 ??和?.以及?: ,分別是空值合并操作符、可選鏈操作符和三目運算,具有一定的參考價值,感興趣的可以了解一下2025-04-04
JavaScript 中的 Object 是一種非常靈活且強大的數(shù)據(jù)類型,它允許我們創(chuàng)建和操作鍵值對,在本文中,我們將深入探討 Object 的一些重要屬性,以便更好地理解和利用這個關(guān)鍵的數(shù)據(jù)結(jié)構(gòu),需要的朋友可以參考下2023-11-11
使用ionic(選項卡欄tab) icon(圖標) ionic上拉菜單(ActionSheet) 實現(xiàn)通訊錄界面切換實例
這篇文章主要介紹了使用ionic(選項卡欄tab) icon(圖標) ionic上拉菜單(ActionSheet) 實現(xiàn)通訊錄界面切換實例代碼,需要的朋友可以參考下2017-10-10
網(wǎng)上關(guān)于生成文章標題樹的示例很多，這篇文章介紹的是利用原生JS實現(xiàn)自動生成文章標題樹，實現(xiàn)過程很簡單，有需要的可以參考借鑒。2016-08-08
JavaScript中的所有事物都是對象，本文為大家介紹下JS中創(chuàng)建對象的幾種方式，如原始方法、工廠方法等等2014-01-01