Le tri des chaînes consiste à organiser les chaînes dans le dictionnaire ou par ordre alphabétique. Lors du développement d'applications utilisant JavaScript, il est courant de trier des tableaux de chaînes. Dans ce tutoriel, nous allons apprendre à trier les chaînes en JavaScript.
Par exemple, si vous obtenez des données d'une API et que vous souhaitez afficher ces données dans un ordre trié, le tri par chaîne est très utile ici.
Ici, nous allons apprendre à trier les chaînes à l'aide de méthodes intégrées et de diverses méthodes simples.
En JavaScript, sort() est une méthode intégrée que nous pouvons utiliser sur les tableaux. De manière générale, dans les autres langages de programmation, la méthode sort() trie les valeurs par défaut. Cependant, JavaScript convertit les nombres en chaînes et les trie par ordre alphabétique.
Ainsi, nous pouvons trier le tableau de chaînes à l’aide de la méthode sort() de JavaScript sans utiliser la fonction de comparaison.
Les utilisateurs peuvent utiliser la méthode sort() de JavaScript pour trier les chaînes selon la syntaxe suivante.
Strings.sort();
Dans la syntaxe ci-dessus, nous utilisons un tableau de chaînes comme référence et la méthode sort().
Dans cet exemple, nous définissons un tableau de chaînes et l'initialisons avec quelques valeurs de chaîne. Après cela, nous prenons le tableau comme référence et exécutons la méthode sort() du tableau. L'utilisateur peut observer le résultat selon lequel toutes les chaînes du tableau sont triées par ordre alphabétique.
<html>
<body>
<h2>Using the <i>sort() method</i> to sort an array of strings in JavaScript.</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let strings = ["Hi", "JavaScript", "TypeScript", "C", "CPP", "Python", "Java", "HTML", "CSS"];
output.innerHTML += "The original string array is " + strings + "<br/>";
strings.sort();
output.innerHTML += "The sorted string array is " + strings + "<br/>";
</script>
</body>
</html>
Un moyen simple de trier une chaîne consiste à utiliser une boucle for. Nous pouvons utiliser deux boucles for imbriquées pour comparer chaque chaîne à toutes les autres chaînes et les trier par ordre alphabétique. Aussi, on peut dire qu'il s'agit d'un algorithme de tri à bulles.
Les utilisateurs peuvent utiliser l'algorithme de tri à bulles pour trier les chaînes par ordre alphabétique en suivant la syntaxe ci-dessous.
for (let a = 0; a < strings.length; a++) {
for (let b = a + 1; b < strings.length; b++) {
if (strings[a] > strings[b]) {
// swap strings at index a and index b
}
}
}
Dans la syntaxe ci-dessus, nous avons utilisé deux boucles for imbriquées et parcouru le tableau de chaînes. De plus, nous comparons deux valeurs de chaîne et, sur cette base, nous échangeons les chaînes.
Étape 1 - Créez un tableau de chaînes.
Étape 2 - Utilisez une boucle for et parcourez le tableau de chaînes en commençant par le 0ème index.
Étape 3 - Dans la boucle for, utilisez une autre boucle for et commencez à itérer le a+1ème index, où a est le pointeur d'itération de la première boucle for.
Étape 4 - Maintenant, comparez les chaînes aux indices ath et bth.
Étape 5 - Si l'ordre alphabétique de la chaîne à l'index ath est supérieur à la chaîne à l'index bth, échangez les deux chaînes.
Étape 6 - Complétez toutes les itérations des deux boucles for pour obtenir toutes les chaînes dans l'ordre trié.
Dans l'exemple ci-dessous, nous avons implémenté l'algorithme de tri à bulles pour trier un tableau de chaînes. Le résultat ci-dessous nous montre que l'algorithme de tri à bulles trie toutes les chaînes où les lettres majuscules précèdent les lettres minuscules, car les lettres majuscules ont une priorité plus élevée que les lettres minuscules dans la comparaison de chaînes.
<html>
<body>
<h2>Using the <i> bubble sort algorithm </i> to sort an array of strings in JavaScript.</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let strings = ["car", "Bike", "truck", "cycle", "Tempo", "cart", "abcd", "string"];
output.innerHTML += "The original string array is " + strings + "<br/>";
for (let a = 0; a < strings.length; a++) {
for (let b = a + 1; b < strings.length; b++) {
if (strings[a] > strings[b]) {
let tempString = strings[a];
strings[a] = strings[b];
strings[b] = tempString;
}
}
}
output.innerHTML += "The sorted string array is " + strings + "<br/>";
</script>
</body>
</html>
Dans cet exemple, nous avons implémenté l'algorithme de tri à bulles pour trier les chaînes, mais nous comparons des chaînes minuscules. Dans l'exemple ci-dessus, nous trions la chaîne par ordre alphabétique et trions d'abord les lettres majuscules. Mais ici, nous ignorons la casse des caractères de chaîne et comparons les chaînes.
<html>
<body>
<h2>Using the <i> bubble sort algorithm </i> to sort an array of strings in JavaScript.</h2>
<div id = "output"> </div>
<button onclick = "sortStrings()"> Sort Strings </button>
<script>
let output = document.getElementById('output');
let strings = ["ab", "Bc", "AB", "AC", "cd", "ds", "ds", "erere", "DS"];
output.innerHTML += "The original strings are " + strings + "<br/>";
function sortStrings() {
function swap(index1, index2) {
let tempString = strings[index1];
strings[index1] = strings[index2];
strings[index2] = tempString;
}
for (let a = 0; a < strings.length; a++) {
for (let b = a + 1; b < strings.length; b++) {
if (strings[a].toLowerCase() > strings[b].toLowerCase()) {
swap(a, b)
}
}
}
output.innerHTML += "The sorted strings are " + strings + "<br/>";
}
</script>
</body>
</html>
Nous avons appris à trier plusieurs chaînes dans ce tutoriel. Dans la première méthode, nous avons utilisé la méthode sort() car elle trie toujours la chaîne par ordre alphabétique. Dans la deuxième méthode, nous avons implémenté l'algorithme de tri à bulles pour trier les chaînes, mais nous pouvons l'optimiser pour améliorer l'efficacité du temps. De plus, nous pouvons utiliser d'autres algorithmes tels que le tri par fusion pour améliorer l'efficacité temporelle et spatiale de l'algorithme de tri.
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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
