Utilisez jQuery/JavaScript pour imploser des tableaux

Dans ce tutoriel, nous apprendrons à fusionner les tableaux donnés en utilisant JavaScript et JQuery. Dans le développement Web, il existe souvent des situations dans lesquelles des tableaux doivent être fusionnés. Par exemple, nous recevons une liste de balises et devons les fusionner dans une chaîne à insérer dans la page Web. Une autre situation dans laquelle vous devrez peut-être fusionner des tableaux concerne l’écriture de requêtes SQL.

Ici, nous allons apprendre 4 façons de concaténer des éléments d'un tableau donné.

Utilisez la méthode Array.join() pour combiner des tableaux

array.join() nous permet de joindre des éléments d'un tableau dans une chaîne en spécifiant le délimiteur.

Grammaire

Les utilisateurs peuvent utiliser la méthode JavaScript join() pour fusionner des tableaux selon la syntaxe suivante.

Array.join(delimiter)

Dans la syntaxe ci-dessus, 'Array' est le tableau de références à fusionner et le délimiteur est le caractère que nous devons utiliser pour concaténer les éléments du tableau.

Exemple

Nous avons créé un tableau « arr » contenant les noms des fruits dans l'exemple ci-dessous. Après cela, nous utilisons la méthode array.join() pour concaténer tous les noms de fruits et les stocker dans la chaîne « fruits ».

Dans la sortie, nous pouvons observer la chaîne 'fruits' contenant les noms de tous les fruits du tableau.

  
 Using the  array.join()  method to implode the array in JavaScript 
 
 
   

Exemple

Nous avons créé un tableau contenant les noms de couleurs dans l'exemple ci-dessous. Après cela, nous avons utilisé la méthode join() et avons passé le caractère « | » comme paramètre de la méthode join() pour séparer chaque élément du tableau par un délimiteur.

Dans la sortie, l'utilisateur peut observer les éléments du tableau d'origine et le résultat du tableau fusionné.

  
 Using the  array.join()  method to implode the array in JavaScript 
 
 
   

Combinez des tableaux en JavaScript à l'aide de la boucle for et de l'opérateur «+»

Nous pouvons parcourir le tableau en utilisant la boucle for ou la boucle while. Lors de l'itération sur les éléments du tableau, nous pouvons les joindre à l'aide de l'opérateur « + » ou « += ». De plus, nous pouvons utiliser des délimiteurs lors de la concaténation des éléments du tableau.

Grammaire

Les utilisateurs peuvent utiliser la boucle for et l'opérateur « + » pour combiner des tableaux selon la syntaxe suivante.

for ( ) { result += array[i]; }

Dans la syntaxe ci-dessus, nous ajoutons arry[i] à la chaîne « résultat ».

Exemple

Dans l'exemple ci-dessous, nous avons créé un tableau contenant des nombres par ordre croissant. Nous créons une variable appelée « numberStr » pour stocker le résultat du tableau concaténé.

Nous utilisons une boucle for pour parcourir le tableau et ajouter number[i] à 'numberStr' à chaque itération. De plus, nous ajoutons le délimiteur « < » après avoir ajouté chaque élément à la chaîne « numberStr ».

Dans le résultat, nous pouvons observer que nous avons préparé la chaîne contenant '<' en concaténant les éléments du tableau.

  
Using the  for loop and + operator  to implode the array in JavaScript
 
 
   

Utilisez la méthode Array.reduce() et l'opérateur « + » pour fusionner des tableaux en JavaScript

array.reduce() fonctionne en fusionnant les listes de tableaux en un seul élément. Ici, nous allons exécuter la méthode array.reduce() en prenant le tableau comme référence et en passant la fonction de rappel comme paramètre pour concaténer les éléments du tableau.

Grammaire

Les utilisateurs peuvent utiliser la méthode array.reduce() pour fusionner des tableaux selon la syntaxe suivante.

message.reduce((a, b) => a + " " + b);

Dans la syntaxe ci-dessus, nous avons transmis la fonction de rappel à la méthode join pour joindre les éléments du tableau.

Exemple

Dans l'exemple ci-dessous, nous créons un tableau contenant des chaînes de message. Après cela, nous prenons le tableau 'message' comme référence et exécutons la méthode réduire() pour fusionner les tableaux.

De plus, nous transmettons les paramètres a et b à la fonction de rappel de la méthode réduire(). Après chaque itération, « a » stocke le résultat fusionné du tableau, tandis que « b » représente l'élément actuel du tableau. Le corps de la fonction ajoute « b » à « a » en les séparant par des espaces.

Using thearray.reduce() methodto implode the array in JavaScript
         

Utilisez la méthode Each() pour fusionner des tableaux dans JQuery

Chaque méthode jQuery () est utilisée pour parcourir les éléments du tableau. Nous pouvons parcourir les éléments du tableau et concaténer chaque élément un par un.

Grammaire

Les utilisateurs peuvent utiliser la méthode each() de JQuery pour fusionner des tableaux selon la syntaxe suivante.

$.each(array, function (index, value) { treeStr += value + " "; });

Dans la syntaxe ci-dessus, la méthode each() implose le tableau comme premier paramètre et concatène le tableau avec la fonction de rappel comme deuxième paramètre.

Exemple

Dans l'exemple ci-dessous, nous avons créé un tableau contenant les noms d'arbres. Après cela, nous parcourons le tableau en utilisant la méthode each() de jQuery. Nous obtenons l’index actuel et la valeur de l’élément dans la fonction de rappel de la méthode each(). Nous ajoutons donc la valeur de l'élément dans 'treeStr'.

Enfin, nous pouvons observer la valeur de « treeStr » dans la sortie.

   
  
Using the  each() method  to implode the array in jQuery
 
 
   

array.join() est l'un des meilleurs moyens de combiner des tableaux en JavaScript. Cependant, si les programmeurs ont besoin de plus d'options personnalisées pour fusionner des tableaux, ils peuvent également utiliser les boucles for et l'opérateur « + ». Dans JQuery, les programmeurs peuvent utiliser la méthode each() ou les méthodes makeArray() et join(), qui fonctionnent de manière similaire à la méthode join() de 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!