快捷導(dǎo)航

JS實(shí)現(xiàn)json對象數(shù)組按對象屬性排序操作示例

更新時間：2018年05月18日 14:38:20 作者：Jason齊齊

這篇文章主要介紹了JS實(shí)現(xiàn)json對象數(shù)組按對象屬性排序操作,涉及javascript使用sort方法針對json數(shù)組的遍歷與排序相關(guān)操作實(shí)現(xiàn)技巧,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)json對象數(shù)組按對象屬性排序操作。分享給大家供大家參考，具體如下：

在實(shí)際工作經(jīng)常會出現(xiàn)這樣一個問題：后臺返回一個數(shù)組中有i個json數(shù)據(jù)，需要我們根據(jù)json中某一項(xiàng)進(jìn)行數(shù)組的排序。

例如返回的數(shù)據(jù)結(jié)構(gòu)大概是這樣：

{
  result:[
   {id:1,name:'中國銀行'},
   {id:3,name:'北京銀行'},
   {id:2,name:'河北銀行'},
   {id:10,name:'保定銀行'},
   {id:7,name:'淶水銀行'}
  ]
}

現(xiàn)在我們根據(jù)業(yè)務(wù)需要，要根據(jù)id的大小進(jìn)行排序，按照id小的json到id大的json順序重新排列數(shù)組的順序

在js中添加排序的方法：

這里使用JavaScript sort() 方法，首先解釋下這個sort的方法

語法：arrayObject.sort(sortby)

sortby：可選，規(guī)定排序順序。必須是函數(shù)。

如果調(diào)用該方法時沒有使用參數(shù)，將按字母順序?qū)?shù)組中的元素進(jìn)行排序，說得更精確點(diǎn)，是按照字符編碼的順序進(jìn)行排序。要實(shí)現(xiàn)這一點(diǎn)，首先應(yīng)把數(shù)組的元素都轉(zhuǎn)換成字符串（如有必要），以便進(jìn)行比較。

如果想按照其他標(biāo)準(zhǔn)進(jìn)行排序，就需要提供比較函數(shù)，該函數(shù)要比較兩個值，然后返回一個用于說明這兩個值的相對順序的數(shù)字。比較函數(shù)應(yīng)該具有兩個參數(shù) a 和 b，其返回值如下：

若 a 小于 b，在排序后的數(shù)組中 a 應(yīng)該出現(xiàn)在 b 之前，則返回一個小于 0 的值。
若 a 等于 b，則返回 0。
若 a 大于 b，則返回一個大于 0 的值。

下面開始使用sort(sortby) 來進(jìn)行這個排序，并打印到控制臺：

function sortId(a,b){
  return a.id-b.id
}
result.sort(sortId);
console.log(result);

完整測試示例代碼：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>www.dbjr.com.cn json數(shù)組排序</title>
</head>
<body>
<script>
var result = [
   {id:1,name:'中國銀行'},
   {id:3,name:'北京銀行'},
   {id:2,name:'河北銀行'},
   {id:10,name:'保定銀行'},
   {id:7,name:'淶水銀行'}
  ]
function sortId(a,b){
  return a.id-b.id
}
result.sort(sortId);
console.log(result);
</script>
</body>
</html>

然后查看控制臺，排序成功：