Tri de tableau d'objet javascript
Javascript est riche de méthodes en tout genre qui parfois nous laisse perplexe quant à ses possibilités. Notamment, ma dernière découverte en date, est le tri de tableau. Mais pas n'importe quel tableau: les tableaux d'objets.
En effet, un tri de tableau simple se fait de cette manière:
var a = [4,6,7,2,10,1];
a.sort();
Mais voilà, j'ai un tableau d'objet et j'ai besoin de le classer selon une propriété particulière, regardons ce tableau:
var a = [
{x:1, y:2, z:5},
{x:4, y:6, z:2},
{x:2, y:3, z:10},
{x:6, y:1, z:3}
];
Si j'ai envie de reclasser mes objets selon "z", je vais devoir boucler dans mes valeurs et reclasser selon des algos bien particulier (tri à bulles, tri récursif...). Or javascript ne me permettra pas d'avoir la vitesse dont j'ai besoin sachant que la fonction "sort" exécutée par le moteur javascript en natif...
Et bien en fait, il y a plus optimal, plus simple et plus rapide ! Il suffit de donner en paramètre une fonction de tri qui prend 2 argument. Ces arguments seront en fait les éléments d'index "i" et "i+1"... Il nous suffit de retourner une valeur booléenne, ou un entier positif ou négatif. Pour notre exemple, voici la fonction:
function sortByZ(a,b){
return b.z - a.z;
}
De ce fait, pour utiliser notre tri d'objets:
var a = [
{x:1, y:2, z:5},
{x:4, y:6, z:2},
{x:2, y:3, z:10},
{x:6, y:1, z:3}
];
function sortByZ(a,b){
return b.z - a.z;
}
a.sort(sortByZ);
La fonction sortByZ est envoyée par référence (car tout est objet en javascript). Mais vous pouvez tout aussi bien la passer anonymement:
var a = [
{x:1, y:2, z:5},
{x:4, y:6, z:2},
{x:2, y:3, z:10},
{x:6, y:1, z:3}
];
a.sort(function (a,b){
return b.z - a.z;
});
Du coup, plus de déclaration, simplement la définition du tri à donner! Vous imaginez bien évidemment que la fonction peut être encore plus complexe... Le résultat est une vitesse d'exécution très appréciable et surtout une somme de code à taper en moins. Seule la comparaison doit être définie.
En espérant que cela vous serve !
Trackbacks
Pour ajouter un trackback (retrolien) sur ce ticket, utilisez cette adresse: http://www.metal3d.org/index.php/trackback/default/tb?id=blog%2F190
Un grand merci.
Je n'avais rien trouvé dans le O'REILLY à ce sujet.
MILLE MILLIARDS DE MILLE MERCIS
Ton billet a sauvé ma journée !!!
Loic
www.loicaigon.com
www.scriptopedia.org