Array.prototype.sort()
BaselineWidely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
La méthodesort()
trie les éléments d'un tableau, dans ce même tableau, et renvoie le tableau. Par défaut, le tri s'effectue sur les éléments du tableau convertis en chaînes de caractères et triées selon les valeurs des unités de code UTF-16 des caractères.
La complexité en espace mémoire et en temps utilisée pour le tri ne peut pas être garantie car elle dépend de l'implémentation.
Exemple interactif
const months = ["March", "Jan", "Feb", "Dec"];months.sort();console.log(months);// Expected output: Array ["Dec", "Feb", "Jan", "March"]const array1 = [1, 30, 4, 21, 100000];array1.sort();console.log(array1);// Expected output: Array [1, 100000, 21, 30, 4]
Syntaxe
arr.sort();arr.sort(fonctionComparaison);
Paramètres
fonctionComparaison
FacultatifCe paramètre optionnel permet de spécifier une fonction définissant l'ordre de tri. Si absente, le tableau est trié selon la valeur de point de codeUnicode de chaque caractère, d'après la conversion en chaine de caractères de chaque élément. Cette fonction prendra deux arguments : le premier élément à comparer et le deuxième élément à comparer.
Valeur de retour
Le tableau trié (le tri est effectué sur le tableau courant qui est modifié, aucune copie n'est réalisée).
Description
Si le paramètrefonctionComparaison
n'est pas fourni, les éléments qui ne valent pasundefined
sont triés en les convertissant en chaines de caractères et en comparant ces chaines selon l'ordre des points de code Unicode. Par exemple, "banane" sera trié avant "cerise", mais "Cerise" arrivera avant "banane" à cause de la majuscule (les majuscules arrivent avant dans la liste). Dans un tri numérique, 9 sera trié avant 80, mais comme ces nombres sont convertis en chaînes de caractères, "80" arrive avant "9" selon l'ordre des unités de code UTF-16. Les éléments valantundefined
sont placés à la fin du tableau.
Note :En UTF-16, les caractères Unicode situés après\uFFFF
sont encodés avec deux unités de codesurrogates sur l'intervalle\uD800
-\uDFFF
. Pour comparer les chaînes de caractères entre elles, ce sont les unités de code séparées qui sont prises en compte. Ainsi, le caractère formé par la pairesurrogate\uD655 \uDE55
sera trié avant le caractère\uFF3A
.
Si le paramètrefonctionComparaison
est fourni, les éléments du tableau (qui ne valent pasundefined
) sont triés selon la valeur de retour de la fonction de comparaison. Sia
etb
sont deux éléments à comparer, alors :
- Si
fonctionComparaison(a, b)
est inférieur à 0, on triea
avec un indice inférieur àb
(a
sera classé avantb
) - Si
fonctionComparaison(a, b)
renvoie 0, on laissea
etb
inchangés l'un par rapport à l'autre, mais triés par rapport à tous les autres éléments. Note : la norme ECMAScript ne garantit pas ce comportement, par conséquent tous les navigateurs (par exemple les versions de Mozilla antérieures à 2003) ne respectent pas ceci. - Si
fonctionComparaison(a, b)
est supérieur à 0, on trieb
avec un indice inférieur àa
. fonctionComparaison(a, b)
doit toujours renvoyer le même résultat à partir de la même paire d'arguments. Si la fonction renvoie des résultats incohérents, alors l'ordre dans lequel sont triés les éléments n'est pas défini.
Une fonction de comparaison aura donc généralement la forme suivante :
function compare(a, b) { if (a est inférieur à b selon les critères de tri) return -1; if (a est supérieur à b selon les critères de tri) return 1; // a doit être égal à b return 0;}
Pour comparer des nombres plutôt que des chaînes, la fonction de comparaison peut simplement soustraireb
àa
(cela fonctionnera si le tableau ne contient pasNaN
ouInfinity
) :
function compareNombres(a, b) { return a - b;}
L'usage desexpressions de fonctions s'avère très pratique avec la méthodesort()
:
var nombres = [4, 2, 5, 1, 3];nombres.sort(function (a, b) { return a - b;});console.log(nombres);// [1, 2, 3, 4, 5]
ECMAScript 2015 permet d'utiliserles fonctions fléchées et ainsi d'obtenir une syntaxe plus concise :
let nombres = [4, 2, 5, 1, 3];nombres.sort((a, b) => a - b);console.log(nombres);
Les objets peuvent être triés d'après les valeurs d'une de leurs propriétés.
var items = [ { name: "Edward", value: 21 }, { name: "Sharpe", value: 37 }, { name: "And", value: 45 }, { name: "The", value: -12 }, { name: "Magnetic", value: 13 }, { name: "Zeros", value: 37 },];items.sort(function (a, b) { return a.value - b.value;});
Différences d'implémentation
Certaines implémentations de JavaScript utilisent un tri stable : l'ordre partiel dea
etb
ne change pas sia
etb
sont égaux. Si l'indice dea
était inférieur à celui deb
avant le tri, il le sera toujours après, quels que soient les mouvements dea
etb
dus au tri.
Le tri est stable dansSpiderMonkey et tous les navigateurs basés sur Mozilla à partir deGecko 1.9 (voir lebug Firefox 224128).
Le comportement de la méthodesort()
a changé entre JavaScript 1.1 et JavaScript 1.2.
En JavaScript 1.1, sur certaines plateformes, la méthodesort
ne fonctionnait pas. Le tri fonctionne sur toutes les plateformes à partir de JavaScript 1.2.
En JavaScript 1.2, cette méthode ne convertit plus les éléments non définis (undefined
) ennull
; elle les place en fin de tableau. Par exemple, supposons que vous ayez ce script :
var a = [];a[0] = "araignée";a[5] = "zèbre";function writeArray(x) { for (i = 0; i < x.length; i++) { console.log(x[i]); if (i < x.length - 1) console.log(", "); }}writeArray(a);a.sort();console.log("\n");writeArray(a);
En JavaScript 1.1, cette fonction affichait :
araignée, null, null, null, null, zèbrearaignée, null, null, null, null, zèbre
En JavaScript 1.2, elle affichera :
araignée, undefined, undefined, undefined, undefined, zèbrearaignée, zèbre, undefined, undefined, undefined, undefined
Exemples
Création, affichage et tri d'un tableau
L'exemple qui suit crée quatre tableaux et affiche le tableau original, puis les tableaux triés. Les tableaux numériques sont triés d'abord sans, puis avec une fonction de comparaison.
var stringArray = ["Bosse", "Bleue", "Béluga"];var numericStringArray = ["80", "9", "700"];var numberArray = [40, 1, 5, 200];var mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200];function compareNombres(a, b) { return a - b;}console.log("Chaînes : " + stringArray.join() + "\n");console.log("Triées : " + stringArray.sort() + "\n\n");console.log("Nombres : " + numberArray.join() + "\n");console.log( "Triés sans fonction de comparaison : " + numberArray.sort() + "\n",);console.log( "Triés avec compareNombres : " + numberArray.sort(compareNombres) + "\n\n",);console.log("Chaînes numériques : " + numericStringArray.join() + "\n");console.log( "Triées sans fonction de comparaison : " + numericStringArray.sort() + "\n",);console.log( "Triées avec compareNombres : " + numericStringArray.sort(compareNombres) + "\n\n",);console.log( "Nombres et chaînes numériques : " + mixedNumericArray.join() + "\n",);console.log( "Triés sans fonction de comparaison : " + mixedNumericArray.sort() + "\n",);console.log( "Triés avec compareNombres : " + mixedNumericArray.sort(compareNombres) + "\n\n",);
Cet exemple produit la sortie suivante. Comme on peut le voir, lorsqu'on utilise la fonction de comparaison, les nombres sont triés correctement qu'ils soient des nombres ou des chaînes numériques.
Chaînes : Bosse,Bleue,BélugaTriées : Bleue,Bosse,BélugaNombres : 40,1,5,200Triés sans fonction de comparaison : 1,200,40,5Triés avec compareNombres : 1,5,40,200Chaînes numériques : 80,9,700Triées sans fonction de comparaison : 700,80,9Triées avec compareNombres : 9,80,700Nombres et chaînes numériques : 80,9,700,40,1,5,200Triés sans fonction de comparaison : 1,200,40,5,700,80,9Triés avec compareNombres : 1,5,9,40,80,200,700
Trier des caractères non-ASCII
Pour des chaines de caractères contenant des caractères non ASCII, c'est à dire des chaines de caractères contenant par exemple des accents (é, è, a, ä, etc.) : utilisezString.localeCompare
. Cette fonction peut comparer ces caractères afin qu'ils apparaissent dans le bon ordre.
var items = ["réservé", "premier", "cliché", "communiqué", "café", "adieu"];items.sort(function (a, b) { return a.localeCompare(b);});// items is [ 'adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé' ]
Trier avec map
La fonction de comparaison peut être amenée à être appelée plusieurs fois pour un même élément du tableau. Selon la fonction utilisée, cela peut entraîner des problèmes de performances. Plus le tableau est grand et plus la fonction de comparaison est complexe, plus il sera judicieux d'envisager des opérations de fonctions appliquées au tableau (map). L'idée est la suivante : on extrait les valeurs du tableau original, en appliquant des opérations dans un tableau temporaire, puis on trie ce tableau temporaire. Enfin, on recompose le tableau final avec les éléments du premier tableau et l'ordre obtenu.
// le tableau à triervar liste = ["Delta", "alpha", "CHARLIE", "bravo"];// Création d'objet temporaire qui contient les positions// et les valeurs en minusculesvar mapped = liste.map(function (e, i) { return { index: i, value: e.toLowerCase() };});// on trie l'objet temporaire avec les valeurs réduitesmapped.sort(function (a, b) { if (a.value > b.value) { return 1; } if (a.value < b.value) { return -1; } return 0;});// on utilise un objet final pour les résultatsvar result = mapped.map(function (e) { return liste[e.index];});
Note :Une bibliothèqueopen source utilise cette approche :mapsort
.
Spécifications
Specification |
---|
ECMAScript® 2026 Language Specification # sec-array.prototype.sort |