Tri en javascript | Expliqué
Nous allons passer en revue le tri d'un tableau avec des valeurs de chaîne et des valeurs numériques en utilisant des fonctions JavaScript intégrées.
.méthode tri ()
Le .trier() La méthode est utilisée pour trier un tableau. L'ordre du réseau trié est alphabétique. Il fonctionne mieux pour les valeurs de chaîne mais produit des résultats incorrects en matière de valeurs numériques. Maintenant, la question vient de savoir pourquoi .La méthode tri () ne fonctionne pas pour les valeurs numériques.
Pour savoir pourquoi .La méthode tri () fonctionne pour les chaînes mais pas pour les valeurs numériques, nous devons d'abord comprendre comment le .La méthode tri () fonctionne.
Comment le .Tour () Méthode Travail
Le .trier() La méthode fonctionne en comparant le premier caractère de la chaîne avec le premier caractère de la valeur suivante. Si les caractères sont les mêmes, il vérifiera la seconde des deux cordes et placera d'abord le plus petit. Plus petit est décidé sur la base de l'ordre alphabétique, comme dans l'exemple ci-dessus "C" est plus petit que "F".
Donc, quand nous passons ceci ".trier()«Méthode Deux valeurs numériques comme« 200 »et« 65 ». Cette fonction compare les premiers caractères («2» de «200» et «6» de «65») et renvoie «65» comme le plus grand nombre. Cependant, dans ce tutoriel, nous passerons également un exemple dans lequel nous allons trier les nombres en utilisant .trier() méthode. Commençons par discuter et comprendre la syntaxe du .trier() méthode.
Syntaxe
La syntaxe du .La méthode tri () est assez basique. C'est:
déployer.trier()Valeur de retour: Un tableau trié.
Par exemple, prenons un tableau avec différents articles à l'intérieur:
array = ["table", "chaise", "verre", "souris", "ordinateur portable", "fan", "car"];Pour trier et afficher la sortie, nous allons utiliser le .Méthode tri () à l'intérieur de la console.Méthode log (), comme ainsi:
console.journal (tableau.trier());L'extrait de code complet deviendrait:
array = ["table", "chaise", "verre", "souris", "ordinateur portable", "fan", "car"];console.journal (tableau.trier());
Exécutez le programme pour observer la sortie:
.fonction reverse ()
Le .La fonction reverse () ne trie pas de tableau dans aucun ordre. Cependant, il inverse le positionnement des éléments à l'intérieur du tableau. Ce qui signifie que le dernier élément d'un tableau devient le premier élément. La syntaxe est comme:
déployer.inverse()Si nous prenons le tableau à partir de l'exemple ci-dessus et essayons de l'inverser en utilisant le .Méthode reverse () Alors l'extrait de code serait quelque chose comme ça.
array = ["table", "chaise", "verre", "souris", "ordinateur portable", "fan", "car"];console.journal (tableau.inverse());
La sortie est comme:
Comme vous pouvez le voir, les éléments d'un tableau sont maintenant dans l'ordre inverse. Mais comment trierons-nous réellement un tableau dans l'ordre descendant?
Comment trier les valeurs du tableau dans l'ordre descendant?
Eh bien, nous devons utiliser une combinaison de la .trier() et le .inverse() méthode. Nous trie d'abord un tableau, puis nous utilisons le .inverse() Méthode pour trier le tableau par ordre décroissant.
Cela semble un peu déroutant, alors essayons d'observer un exemple. Pour cet exemple, prenez le tableau des exemples ci-dessus.
array = ["table", "chaise", "verre", "souris", "ordinateur portable", "fan", "car"];Maintenant que nous avons un tableau dans un ordre complètement aléatoire. La première étape consiste à le trier, alors faisons-le: en utilisant
déployer.trier()Maintenant que le tableau est trié, nous devons l'inverser en utilisant la ligne suivante:
déployer.inverse();La dernière étape consiste à observer la sortie et à faire, nous allons afficher le tableau à l'aide du console.enregistrer() méthode comme ceci:
console.journal (tableau);L'extrait de code complet est comme
array = ["table", "chaise", "verre", "souris", "ordinateur portable", "fan", "car"];déployer.trier();
déployer.inverse();
console.journal (tableau);
La sortie est comme:
C'est tout, c'est notre tableau trié dans l'ordre alphabétique descendant. Voyons maintenant comment travailler avec des valeurs numériques.
Comment trier les valeurs numériques en utilisant .méthode tri ()
Comme nous l'avons déjà mentionné ci-dessus, le .trier() la méthode ne produit pas de résultats corrects lorsqu'il s'agit de tri les valeurs numériques, et c'est parce que le .trier() La méthode fonctionne en comparant les chaînes, il considère les valeurs numériques comme des chaînes, puis les compare.
Commençons par créer un tableau de valeurs numériques. Ainsi.
NumberArray = [2,3,4,6,66,100,25,33]Maintenant, observons la sortie en exécutant le. trier() Méthode sur ce tableau à l'intérieur du console.enregistrer() fonction
console.Log (NumberArray.trier());La sortie est comme:
Comme vous pouvez le voir, le résultat est hors de la marque. Pourquoi est-ce si?. Eh bien, nous avons déjà expliqué comment le .La méthode tri () fonctionne. Ce qui se passe, c'est qu'il prend le premier caractère de la chaîne et le compare aux premiers caractères de la valeur suivante, bien que 100 soit supérieur à 33. Mais, lorsque vous comparez les premiers caractères, «1» est plus petit que «3», donc 100 est placé avant 33.
Alors, nous résolvons ce problème? Eh bien, nous le faisons en utilisant une fonction de comparaison à l'intérieur de la fonction de tri. La fonction de comparaison est comme:
fonction (a, b)Retour A-B
Nous prenons le «nombre”De l'exemple ci-dessus et appliquez cette fonction de comparaison sur elle pour observer la sortie.
NumberArray = [2, 3, 4, 6, 66, 100, 25, 33];nombre.tri (fonction (a, b)
retourner a - b;
);
console.Log (NumberArray);
Avec cela, nous obtenons la sortie suivante.
Comme vous pouvez le voir, nous avons enfin notre tableau de nombres trié en ordre décroissant.
Comment trier les valeurs numériques dans l'ordre descendant?
Maintenant que nous connaissons le tri d'un tableau numérique dans l'ordre croissant, nous pouvons commencer à essayer de le trier par ordre décroissant. Tout comme essayer de trier les chaînes dans l'ordre descendant, nous pouvons utiliser la méthode inversée () pour inverser le tableau trié numérique comme tel:
NumberArray = [2, 3, 4, 6, 66, 100, 25, 33];nombre.tri (fonction (x, y)
retour x - y;
);
nombre.inverse();
console.Log (NumberArray);
La sortie est comme:
Cependant, il existe une autre façon de le faire, et c'est de modifier l'instruction de retour dans la fonction compare. Changez la déclaration à ceci:
retour B-A;Après cela, nous imprimons simplement le tableau en utilisant le console.enregistrer() méthode. L'extrait de code complet est comme:
NumberArray = [2, 3, 4, 6, 66, 100, 25, 33];nombre.tri (fonction (x, y)
retour y - x;
);
console.Log (NumberArray);
La sortie sera:
Comment trier les tableaux d'objets en javascript
Imaginez que nous ayons un éventail d'objets, par exemple, prenons des objets de personnes avec leur nom et leur année de naissance.
Maintenant, nous voulons trier ce tableau d'ici l'année où ils sont nés. Nous avons le tableau d'objets du peuple comme:
consta People = [Nom: "Albert", YOB: 1997,
nom: "Dave", yob: 2005,
nom: "John", yob: 2000
]]
Maintenant, nous pouvons trier ce tableau d'objets en utilisant .tri () et comparer la fonction comme:
personnes.tri (fonction (x, y)retour x.yob - x.loubard;
);
Maintenant, la dernière chose est d'afficher ce tableau en utilisant le code suivant:
console.Log ("Les personnes en ordre d'âge sont aussi");pour (soit i = 0; i <= people.length; i++)
console.journal (les gens [i].Nom + "est né dans" + les gens [i].loubard);
L'extrait de code complet est comme:
consta People = [Nom: "Albert", YOB: 1997,
nom: "Dave", yob: 2005,
nom: "John", yob: 2000,
]]
personnes.tri (fonction (x, y)
retour x.yob - y.loubard;
);
console.Log ("Les personnes en ordre d'âge sont aussi");
pour (soit i = 0; i <= people.length; i++)
console.journal (les gens [i].Nom + "est né dans" + les gens [i].loubard);
Lorsque nous exécutons le fichier, nous obtenons la sortie suivante:
Comme nous pouvons le voir, tous les objets sont maintenant triés en fonction de leur «yob» qui est l'année de naissance de la personne.
C'est tout pour le tri en javascript.
Conclusion
Le tri est une partie essentielle lorsque vous travaillez avec des tableaux. JavaScript est livré avec diverses fonctions intégrées qui nous aident à trier les éléments du tableau. Nous avons appris comment le .trier() La méthode fonctionne en javascript, sa syntaxe et sa valeur de retour. De plus, nous avons appris à utiliser la combinaison de .trier() et .inverse() Méthode pour trier les tableaux dans l'ordre descendant. Enfin, nous avons appris comment nous pouvons utiliser le .trier() Méthode pour trier les valeurs numériques à l'aide de la fonction compare.