快捷導(dǎo)航

JavaScript中數(shù)組嵌套對象排序方法的示例詳解

更新時間：2024年03月05日 08:29:03 作者：還是大劍師蘭特

在?JavaScript?中,可以使用?sort()?方法對包含嵌套對象的數(shù)組進(jìn)行排序,本文將通過三個簡單的示例為大家進(jìn)行簡單的介紹,需要的可以參考下

sort() 方法可以接受一個比較函數(shù)作為參數(shù)來指定排序規(guī)則。該比較函數(shù)應(yīng)該返回一個負(fù)數(shù)、零或正數(shù)，以指示要排序的兩個元素的相對順序。如果要對數(shù)組中的對象按照其屬性進(jìn)行排序，則可以在比較函數(shù)中訪問這些屬性并將它們進(jìn)行比較。如果要對嵌套對象進(jìn)行排序，則可以使用點表示法或方括號表示法訪問嵌套對象的屬性。

示例1

let arr = [
  { id: 1, name: 'John', age: 25 },
  { id: 2, name: 'Bob', age: 30 },
  { id: 3, name: 'Mary', age: 30 },
  { id: 4, name: 'Tom', age: 20 }
];

arr.sort(function(a, b) {
  if (a.age < b.age) {
    return -1;
  }
  if (a.age > b.age) {
    return 1;
  }
  
  // 年齡相同的情況下，按照 id 排序 
  if (a.id < b.id) {
    return -1;
  }
  if (a.id > b.id) {
    return 1;
  }

  return 0;
});

console.log(arr);

執(zhí)行結(jié)果：

示例2

var arr = [
 {name:'大', age:5},
 {name:'劍', age:18},
 {name:'師', age:8},
];

// 排序方法
function compare(property) {//property:根據(jù)什么屬性排序
 return function(a,b){
  var value1 = a[property];
  var value2 = b[property];
      // value2 - value1; ——> 降序
      // value1 - value2; ——> 升序
  return value1 - value2;//升序排序
 }
}

console.log(arr.sort(compare('age')))

執(zhí)行結(jié)果：

示例3

js提供了字符串的對比方法**localeCompare()**，該方法返回的是一個數(shù)字用來表示一個參考字符串和對比字符串是排序在前，在后或者相同。該方法基本不單獨使用，大部分時間是配合字符串排序使用的。

let arr = [
  { name: "張三", age: 20 },
  { name: "李四", age: 25 },
  { name: "王五", age: 22 }
];

// 按年齡升序排序
arr.sort((a, b) => a.age - b.age);
console.log(arr);
/*
[
  { name: "張三", age: 20 },
  { name: "王五", age: 22 },
  { name: "李四", age: 25 }
]
*/

// 按姓名升序排序
arr.sort((a, b) => a.name.localeCompare(b.name));
console.log(arr);
/*
[
  { name: "張三", age: 20 },
  { name: "李四", age: 25 },
  { name: "王五", age: 22 }
]
*/