js使用Array.prototype.sort()對數(shù)組對象排序的方法
更新時間：2015年01月28日 11:59:04 投稿：shichen2014
這篇文章主要介紹了js使用Array.prototype.sort()對數(shù)組對象排序的方法,實例分析了Array.prototype.sort()的原理與相關(guān)的使用技巧,需要的朋友可以參考下
本文實例講述了js使用Array.prototype.sort()對數(shù)組對象排序的方法。分享給大家供大家參考。具體分析如下：
在講對數(shù)組對象進(jìn)行排序時，我們先來簡單的了解一下Array.prototype.sort()。sort方法接受一個參數(shù)——Function，function會提供兩個參數(shù)，分別是兩個進(jìn)行比較的元素，如果元素是String類型則通過Unicode code進(jìn)行比較，如果是Number類型則比較值的大小。如果比較的函數(shù)中返回1則兩個元素交換位置，0和-1不交換位置。先看一個例子：
復(fù)制代碼 代碼如下:
var arr = [3, 5, 2, 1];
// 從小到大排序
arr.sort(function (a, b) {
return a > b ? 1 : -1;
});
// 得到的結(jié)果：[1, 2, 3, 5]
// 從小到大排序
arr.sort(function (a, b) {
return a > b ? 1 : -1;
});
// 得到的結(jié)果：[1, 2, 3, 5]
那么回到我們的主題，如果是對一個數(shù)組對象進(jìn)行排序，該怎么寫呢？其實原理和上面一樣，如：
復(fù)制代碼 代碼如下:
var arr = [
{ a : 2, b : 3.2},
{ a : 3, b : 1.2},
{ a : 4, b : 2.2},
{ a : 6, b : 1.2},
{ a : 5, b : 3.2}
]
/// 從小到大按屬性b排序
arr.sort(function(x, y){
return x.b > y.b ? 1:-1;
});
{ a : 2, b : 3.2},
{ a : 3, b : 1.2},
{ a : 4, b : 2.2},
{ a : 6, b : 1.2},
{ a : 5, b : 3.2}
]
/// 從小到大按屬性b排序
arr.sort(function(x, y){
return x.b > y.b ? 1:-1;
});
x和y就是arr的一個元素，即一個對象，所以直接比較兩個對象的屬性即可。
上面的例子中，最小的元素中有重復(fù)，如果需求是：先按b屬性從小到大排序，如果最小中有重復(fù)則再按a屬性排序，那應(yīng)該怎么寫呢？
在排序的時候，先按b屬性排序，如果x.b的大于y.b則將x移到y(tǒng)的右邊，如果x.b等于y.b則再通過x.a和y.a進(jìn)行比較，所以代碼如下：
復(fù)制代碼 代碼如下:
arr.sort(function (x, y) {
if (x.b > y.b) {
return 1;
} else if (x.b === y.b) {
return x.a > y.a ? 1 : -1;
} else if (x.b < y.b) {
return -1;
}
})
if (x.b > y.b) {
return 1;
} else if (x.b === y.b) {
return x.a > y.a ? 1 : -1;
} else if (x.b < y.b) {
return -1;
}
})
希望本文所述對大家的javascript程序設(shè)計有所幫助。
您可能感興趣的文章:
- Js數(shù)組排序函數(shù)sort()介紹
- js對數(shù)組中的數(shù)字從小到大排序?qū)崿F(xiàn)代碼
- Javascript數(shù)組的排序 sort()方法和reverse()方法
- JS數(shù)組排序技巧匯總(冒泡、sort、快速、希爾等排序)
- js中數(shù)組(Array)的排序(sort)注意事項說明
- js sort 二維數(shù)組排序的用法小結(jié)
- JavaScript中數(shù)組Array.sort()排序方法詳解
- JS實現(xiàn)根據(jù)數(shù)組對象的某一屬性排序操作示例
- JS實現(xiàn)json對象數(shù)組按對象屬性排序操作示例
- js實現(xiàn)嵌套數(shù)組重排序
相關(guān)文章
圖表組件Chart.js是Bootstrap比較好用的組件之一,與一款收費的組件highchart類似,效果上來看免費與收費的產(chǎn)品相差還是有一點點的，不過功能上差不多能滿足我們項目的需要，本文給大家介紹Bootstrap Chart組件使用，需要的朋友參考下吧2016-04-04
前端實現(xiàn)HTML網(wǎng)頁轉(zhuǎn)PDF并導(dǎo)出
這篇文章主要為大家詳細(xì)介紹了前端如何通過html2canvas和jsPDF實現(xiàn)HTML網(wǎng)頁轉(zhuǎn)PDF并導(dǎo)出,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以參考一下2025-01-01
在js中，我們時常用到用iframe做系統(tǒng)框架，在子頁面也，父頁面之間的值傳遞是一個問題，下面是js獲取父窗體和子窗體的對象js：2013-03-03
這篇文章主要為大家詳細(xì)介紹了Javascript實現(xiàn)單選框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-12-12
利用JavaScript實現(xiàn)簡單3D開關(guān)書本模型
這篇文章主要為大家詳細(xì)介紹了如何利用JavaScript實現(xiàn)簡單3D開關(guān)書本模型的效果,文中的實現(xiàn)代碼講解的非常詳細(xì),具有一定參考價值,感興趣的同學(xué)可以動手嘗試一下2023-11-11
這篇文章主要介紹了js計算兩個時間之間天數(shù)差的實例代碼，有需要的朋友可以參考一下2013-11-11
本文給大家介紹js動態(tài)生成二維碼圖片的相關(guān)內(nèi)容，感興趣的朋友一起學(xué)習(xí)吧2016-04-04
本篇文章主要介紹了JS比較兩個時間大小的簡單示例代碼。需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
JavaScript實現(xiàn)鼠標(biāo)滾輪控制頁面圖片切換功能示例
這篇文章主要介紹了JavaScript實現(xiàn)鼠標(biāo)滾輪控制頁面圖片切換功能,涉及javascript事件響應(yīng)及頁面元素動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-10-10
Js 代碼中,ajax請求地址后加隨機數(shù)防止瀏覽器緩存的原因
Js 代碼中,ajax請求地址后加隨機數(shù)防止瀏覽器緩存的原因，需要的朋友可以參考一下2013-05-05