Maison > Article > interface Web > Comment calculer l’union de tableaux JavaScript ?

Comment calculer l’union de tableaux JavaScript ?

王林avant: 2023-09-10 18:49:091133parcourir

如何计算 JavaScript 数组的并集？

Nous pouvons obtenir l'union de deux tableaux en fusionnant les deux tableaux et en supprimant les éléments en double, et l'union donne les éléments uniques dans les deux tableaux.

Dans ce tutoriel, nous apprendrons à calculer l'union de tableaux JavaScript en utilisant différentes méthodes.

Utilisez la structure de données set()

La première méthode consiste à utiliser la structure de données set(). Les structures de données de collection ne peuvent contenir que des éléments uniques. Nous pouvons ajouter tous les éléments des deux tableaux à l'ensemble et créer un nouveau tableau à partir des éléments de l'ensemble pour créer l'union.

Grammaire

Les utilisateurs peuvent utiliser la structure de données définie pour calculer l'union des tableaux JavaScript selon la syntaxe suivante.

let union = [...new Set([...array1, ...array2])];

Dans la syntaxe ci-dessus, nous utilisons l'opérateur spread pour concaténer deux tableaux et créer une nouvelle collection à partir du tableau résultant. Après cela, nous utilisons à nouveau l'opérateur spread pour ajouter les éléments de la collection au tableau.

Exemple 1

Dans l'exemple ci-dessous, array1 et array2 contiennent des nombres communs. Tout d’abord, nous connectons array1 et array2 à l’aide de l’opérateur spread. Après cela, nous créons un ensemble à partir du tableau résultant en utilisant le nouveau constructeur Set(). L'ensemble ne peut contenir que des éléments uniques. Par conséquent, il contient tous les éléments de l’union des deux tableaux.

Après cela, nous utilisons l'opérateur spread pour ajouter tous les éléments de la collection dans le tableau associatif. Dans la sortie, l’utilisateur peut observer l’union des deux tableaux.

<html>
<body>
   <h3> Using the <i> set() </i> data structure to compute the union of two arrays in JavaScript </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      
      // using the set() to compute union
      let array1 = [1, 2, 3, 4, 5];
      let array2 = [4, 5, 6, 7, 8];
      let union = [...new Set([...array1, ...array2])];
      output.innerHTML = "The first array is " + array1 + "<br>";
      output.innerHTML += "The second array is " + array2 + "<br>";
      output.innerHTML += "The union of the two arrays is " + union + "<br>";
   </script>
</body>
</html>

Calculez l'union de tableaux JavaScript à l'aide d'objets

Dans cette méthode, nous pouvons ajouter des valeurs de tableau en tant que propriétés d'objet. L'objet contient toujours des clés uniques. Nous pouvons donc utiliser l'élément du tableau comme clé de l'objet et n'importe quelle valeur pour cette clé particulière. Après cela, nous pouvons obtenir toutes les clés d'objet pour obtenir l'union des tableaux.

Grammaire

Les utilisateurs peuvent utiliser des objets pour calculer l'union des tableaux selon la syntaxe suivante.

for () {
   union[names1[i]] = 1;
}
for (let key in the union) {
   finalArray.push(key);
}

Dans la syntaxe ci-dessus, nous poussons d'abord tous les éléments du tableau comme clés de l'objet. Après cela, nous récupérons les clés de l'objet et les ajoutons au tableau.

Exemple 2

Dans l'exemple ci-dessous, nous avons deux tableaux nommés noms1 et noms2. Nous ajoutons le premier élément du tableau comme clé de l'objet. Après cela, nous ajoutons les éléments du deuxième tableau comme clés de l'objet.

Ensuite, nous parcourons l'objet, récupérons la clé de l'objet et la poussons vers le FinalArray. FinalArray contient l'union des tableaux Name1 et Name2.

<html>
<body>
   <h3> Using the <i> object </i> to compute the union of two arrays in JavaScript </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      
      // using the object to compute the union of two arrays
      let names1 = ["John", "Peter", "Sally", "Jane", "Mark"];
      let names2 = ["Peter", "Sally", "Greg"];
      let union = {};
      
      //Add all the elements of the first array to the object
      for (let i = 0; i < names1.length; i++) {
         union[names1[i]] = 1;
      }
      for (let i = 0; i < names2.length; i++) {
         union[names2[i]] = 1;
      }
      
      //Convert the object to an array
      let finalArray = [];
      for (let key in union) {
         finalArray.push(key);
      }
      output.innerHTML = "First array: " + JSON.stringify(names1) + "<br>";
      output.innerHTML += "Second array: " + JSON.stringify(names2) + "<br>";
      output.innerHTML += "The union of the two arrays: " + JSON.stringify(finalArray) + "<br>";
   </script>
</body>
</html>

Utilisez les méthodes Filter() et Concat()

La méthode

concat() est utilisée pour fusionner deux ou plusieurs tableaux. Nous pouvons utiliser la méthode filter() pour fusionner deux tableaux et filtrer les éléments uniques. De cette façon, nous pouvons utiliser les méthodes concat() et filter() pour calculer l’union des tableaux.

Grammaire

Les utilisateurs peuvent utiliser les méthodes filter() et concat() pour calculer l'union des tableaux selon la syntaxe suivante.

let cities = cities1.concat(cities2);
cities.sort();
let unionCities = cities.filter((value, index) => cities.indexOf(value) === index);

Dans la syntaxe ci-dessus, nous fusionnons d'abord les deux tableaux, les trions puis filtrons les éléments uniques à l'aide de la méthode filter().

Exemple 3

Dans l'exemple ci-dessous, les tableaux city1 et citites2 contiennent des noms de villes, dont certains sont courants. Le tableau villes contient les éléments des deux tableaux.

Après cela, nous utilisons la méthode sort() pour trier le tableau des villes. Ensuite, nous utilisons la méthode filter() pour filtrer les valeurs uniques du tableau des villes. Dans la méthode filter(), nous passons la fonction de rappel en paramètre, qui vérifie si l'index de la ville actuelle est égal à l'index actuel pour supprimer les éléments en double.

<html>
<body>
   <h3> Using the <i> filter() and concat() methods </i> to compute the union of two arrays in JavaScript </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      let cities1 = ["Surat", "Ahmedabad", "Rajkot", "Vadodara", "Pune"];
      let cities2 = ["Mumbai", "Pune", "Nagpur", "Nashik", "Rajkot"];
      let cities = cities1.concat(cities2);
      cities.sort();
      
      // filter unique values in the array
      let unionCities = cities.filter((value, index) => cities.indexOf(value) === index);
      output.innerHTML = "First array: " + JSON.stringify(cities1) + "<br>";
      output.innerHTML += "Second array: " + JSON.stringify(cities2) + "<br>";
      output.innerHTML += "The union of the two arrays: " + JSON.stringify(unionCities) + "<br>";
   </script>
</body>
</html>

Conclusion

L'utilisateur a appris trois façons différentes de calculer l'union de tableaux en JavaScript. La première approche nécessite un code linéaire utilisant une structure de données de collection. La deuxième méthode utilise des objets et la troisième méthode utilise les méthodes filter() et concat().

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!

JavaScript 运算符 sort 构造函数 Filter 回调函数数据结构对象

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：Comment convertir un titre en URL Slug en utilisant JavaScript ?Article suivant：Comment convertir un titre en URL Slug en utilisant JavaScript ?

Articles Liés

Voir plus