js對象數(shù)組按屬性快速排序
更新時間:2011年01月31日 19:08:25 作者:
前一篇《關(guān)于selector性能比賽》中提到,目測覺得在$("div,p,a")這樣有逗號時,sizzle耗時異常(600多個元素,花了200ms),說是它可能沒有優(yōu)化ie下的排序。
按所推薦的程序在IE下跑了下,的確,排序耗時很小。
<script>
/*
* 洗牌
*/
function getRandomPlayCard(m){
var array1=new Array(m);
for(var i=0;i<m;i++){
var rnd=Math.floor(Math.random()*(i+0.99999))
array1[i]=array1[rnd];
array1[rnd]=i;
}
return array1;
};
/*
* 快速排序,按某個屬性,或按“獲取排序依據(jù)的函數(shù)”,來排序.
* @method soryBy
* @static
* @param {array} arr 待處理數(shù)組
* @param {string|function} prop 排序依據(jù)屬性,獲取
* @param {boolean} desc 降序
* @return {array} 返回排序后的新數(shù)組
*/
var sortBy =function (arr, prop, desc){
var props=[],
ret=[],
i=0,
len=arr.length;
if(typeof prop=='string') {
for(; i<len; i++){
var oI = arr[i];
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
}
}
else if(typeof prop=='function') {
for(; i<len; i++){
var oI = arr[i];
(props[i] = new String(oI && prop(oI) || ''))._obj = oI;
}
}
else {
throw '參數(shù)類型錯誤';
}
props.sort();
for(i=0; i<len; i++) {
ret[i] = props[i]._obj;
}
if(desc) ret.reverse();
return ret;
};
for(var i=0;i<1000;i++){
document.write('<div>a'+i+'</div>')
}
var els=document.getElementsByTagName('div');
var cards=getRandomPlayCard(els.length);
var randomEls=[];
for(var i=0,len=cards.length;i<len;i++) randomEls[cards[i]]=els[i];//按洗出的牌來洗元素數(shù)組
alert(['總數(shù):',randomEls.length,'打亂順序后: ',randomEls[0].innerHTML,randomEls[randomEls.length-1].innerHTML]);
var d0=new Date();
var elsSorted=sortBy(randomEls,function(el){return el.sourceIndex+100000000;})
alert(['總數(shù):',elsSorted.length,'排序耗時:',new Date()-d0,'重新排序后: ',elsSorted[0].innerHTML,elsSorted[elsSorted.length-1].innerHTML]);
</script>
Array原生的sort,當(dāng)它傳一個比較函數(shù)時,由于它內(nèi)部用哪種排序算法,都需要多次比對,所以,耗時是很自然的事。
上面的快速排序,它并沒有多次比對,
而是:
1。取出el屬性值,用屬性值產(chǎn)生一個String對象,
2。將el附在String對象上。
3。用String對象組成數(shù)組。
4。用原生的sort進(jìn)String對象數(shù)組排序。
5。在排好序的String數(shù)組中,按序取出el。
即得到排好序的el數(shù)組。
復(fù)制代碼 代碼如下:
<script>
/*
* 洗牌
*/
function getRandomPlayCard(m){
var array1=new Array(m);
for(var i=0;i<m;i++){
var rnd=Math.floor(Math.random()*(i+0.99999))
array1[i]=array1[rnd];
array1[rnd]=i;
}
return array1;
};
/*
* 快速排序,按某個屬性,或按“獲取排序依據(jù)的函數(shù)”,來排序.
* @method soryBy
* @static
* @param {array} arr 待處理數(shù)組
* @param {string|function} prop 排序依據(jù)屬性,獲取
* @param {boolean} desc 降序
* @return {array} 返回排序后的新數(shù)組
*/
var sortBy =function (arr, prop, desc){
var props=[],
ret=[],
i=0,
len=arr.length;
if(typeof prop=='string') {
for(; i<len; i++){
var oI = arr[i];
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
}
}
else if(typeof prop=='function') {
for(; i<len; i++){
var oI = arr[i];
(props[i] = new String(oI && prop(oI) || ''))._obj = oI;
}
}
else {
throw '參數(shù)類型錯誤';
}
props.sort();
for(i=0; i<len; i++) {
ret[i] = props[i]._obj;
}
if(desc) ret.reverse();
return ret;
};
for(var i=0;i<1000;i++){
document.write('<div>a'+i+'</div>')
}
var els=document.getElementsByTagName('div');
var cards=getRandomPlayCard(els.length);
var randomEls=[];
for(var i=0,len=cards.length;i<len;i++) randomEls[cards[i]]=els[i];//按洗出的牌來洗元素數(shù)組
alert(['總數(shù):',randomEls.length,'打亂順序后: ',randomEls[0].innerHTML,randomEls[randomEls.length-1].innerHTML]);
var d0=new Date();
var elsSorted=sortBy(randomEls,function(el){return el.sourceIndex+100000000;})
alert(['總數(shù):',elsSorted.length,'排序耗時:',new Date()-d0,'重新排序后: ',elsSorted[0].innerHTML,elsSorted[elsSorted.length-1].innerHTML]);
</script>
Array原生的sort,當(dāng)它傳一個比較函數(shù)時,由于它內(nèi)部用哪種排序算法,都需要多次比對,所以,耗時是很自然的事。
上面的快速排序,它并沒有多次比對,
而是:
1。取出el屬性值,用屬性值產(chǎn)生一個String對象,
2。將el附在String對象上。
3。用String對象組成數(shù)組。
4。用原生的sort進(jìn)String對象數(shù)組排序。
5。在排好序的String數(shù)組中,按序取出el。
即得到排好序的el數(shù)組。
相關(guān)文章
躲避這些會改變原數(shù)組JavaScript數(shù)組方法讓開發(fā)流暢無阻
JavaScript中有些數(shù)組的操作方法并不符合我們預(yù)期,容易導(dǎo)致想象不到的結(jié)果,因此,為避免這種情況的發(fā)生,本文將介紹哪些原生數(shù)組方法能改變原數(shù)組以及我對于如何更好地使用數(shù)組方法的建議2023-05-05微信小程序?qū)W習(xí)之?dāng)?shù)據(jù)處理詳解
這篇文章主要給大家介紹了關(guān)于微信小程序中數(shù)據(jù)處理的相關(guān)資料,文中介紹的非常詳細(xì),對大家具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考借鑒,下面來一起看看吧。2017-07-07利用Plupload.js解決大文件上傳問題, 帶進(jìn)度條和背景遮罩層
本篇文章主要介紹了c#+Plupload.js解決大容量文件上傳問題, 帶進(jìn)度條和背景遮罩層,具有一定的參考價值,感興趣的小伙伴們可以參考一下。2017-03-03了解在JavaScript中將值轉(zhuǎn)換為字符串的5種方法
這篇文章主要介紹了在JavaScript中將值轉(zhuǎn)換為字符串的5種方法,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,下面小編就和大家一起來學(xué)習(xí)下吧2019-06-06一個頁面元素appendchild追加到另一個頁面元素的問題
一般都是自己創(chuàng)建元素然后append到頁面的但是如果是頁面本身有的元素append到另一個頁面元素呢,很多的新手朋友對此問題比較好奇,本人也是如此啊,好了不多說,切入主題,感興趣的朋友可以了解下哦2013-01-01