Maison >interface Web >js tutoriel >Comment trier un tableau d'objets à l'aide de plusieurs champs en JavaScript ?

Comment trier un tableau d'objets à l'aide de plusieurs champs en JavaScript ?

DDD
DDDoriginal
2024-12-25 18:37:10686parcourir

How can I sort an array of objects using multiple fields in JavaScript?

Tri multi-champs de tableaux d'objets

Dans les cas où un tri est requis en fonction de plusieurs champs dans un tableau d'objets, un tri en chaîne une approche peut être employée. Cette méthode consiste à comparer les valeurs de chaque champ dans l'ordre, jusqu'à ce qu'une différence non nulle soit obtenue.

Mise en œuvre

Considérez le tableau d'objets suivant :

var homes = [
    {"h_id":"3", "city":"Dallas", "state":"TX", "zip":"75201", "price":"162500"},
    {"h_id":"4", "city":"Bevery Hills", "state":"CA", "zip":"90210", "price":"319250"},
    {"h_id":"6", "city":"Dallas", "state":"TX", "zip":"75000", "price":"556699"},
    {"h_id":"5", "city":"New York", "state":"NY", "zip":"00010", "price":"962500"}
];

Pour trier ce tableau en fonction de la ville (ascendant) puis du prix (décroissant), utilisez le tri suivant fonction :

data.sort(function (a, b) {
    return a.city.localeCompare(b.city) || b.price - a.price;
});

Explication

La fonction de tri prend un rappel comme argument, qui compare deux objets a et b. Il renvoie une valeur qui détermine l'ordre des éléments :

  • Si a.city.localeCompare(b.city) est inférieur à zéro, a est placé avant b.
  • Si a.city.localeCompare(b.city) est supérieur à zéro, b est placé avant a.
  • Si a.city.localeCompare(b.city) est égal à zéro, b.price - a.price est utilisé pour comparer les prix. Une valeur positive place b avant a et une valeur négative place a avant b.

Exemple de sortie

Après le tri, le tableau des maisons est réorganisé comme suit :

[{
    "h_id": "3",
    "city": "Dallas",
    "state": "TX",
    "zip": "75201",
    "price": "162500"
},
{
    "h_id": "6",
    "city": "Dallas",
    "state": "TX",
    "zip": "75000",
    "price": "556699"
},
{
    "h_id": "4",
    "city": "Bevery Hills",
    "state": "CA",
    "zip": "90210",
    "price": "319250"
},
{
    "h_id": "5",
    "city": "New York",
    "state": "NY",
    "zip": "00010",
    "price": "962500"
}]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn