Comment trier les objets JavaScript par valeurs de propriété ?

Tri des objets par valeurs de propriété

En JavaScript, les objets sont des collections non ordonnées de paires clé-valeur. Cependant, il peut y avoir des situations dans lesquelles nous devons trier les objets en fonction des valeurs de leurs propriétés. Ceci peut être réalisé en convertissant l'objet en tableau, en triant le tableau par valeurs, puis en reconstruisant l'objet à partir du tableau trié.

Considérons l'exemple fourni :

var list = {
  "you": 100, 
  "me": 75, 
  "foo": 116, 
  "bar": 15
};

Pour trier les propriétés de la liste en fonction de leurs valeurs, nous pouvons faire ce qui suit :

let sortable = [];
for (let property in list) {
    sortable.push([property, list[property]]);
}

sortable.sort((a, b) => a[1] - b[1]);

// [["bar", 15], ["me", 75], ["you", 100], ["foo", 116]]

Cela crée un tableau triable contenant des sous-tableaux de valeur de propriété paires, qui sont ensuite triées par ordre croissant en fonction des valeurs. Maintenant, nous pouvons reconstruire l'objet dans l'ordre trié :

let objSorted = {};
sortable.forEach(item => {
    objSorted[item[0]] = item[1];
});

Cela nous donne l'objet trié :

objSorted = {
  "bar": 15, 
  "me": 75, 
  "you": 100, 
  "foo": 116
};

Dans ES8 et supérieur, nous pouvons simplifier ce processus en utilisant Object. entrées() :

const maxSpeed = {
  car: 300, 
  bike: 60, 
  motorbike: 200, 
  airplane: 1000,
  helicopter: 400, 
  rocket: 8 * 60 * 60
};

const sortable = Object.entries(maxSpeed)
  .sort(([,a],[,b]) => a-b)
  .reduce((r, [k, v]) => ({ ...r, [k]: v }), {});

console.log(sortable);

Ceci renvoie le tableau trié de paires propriété-valeur en tant qu'objet.

C'est Il est important de noter que même si le tri des objets par valeurs de propriété est possible, cela repose sur une bizarrerie d'implémentation en JavaScript et pourrait échouer à l'avenir. Il est recommandé d'éviter de faire des hypothèses sur l'ordre des éléments dans les objets JavaScript.

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!