Comment supprimer les données en double des tableaux dans Vue (trois méthodes)

Pendant le processus de développement de Vue, nous utilisons souvent des tableaux. Cependant, dans le développement réel, nous rencontrons parfois le problème des données en double. À ce stade, nous devons dédupliquer le tableau. Cet article vous présentera la méthode de déduplication de tableau dans Vue.

1. Utilisez la structure set pour dédupliquer

set est une structure de données dans ES6 qui peut supprimer les éléments en double. Elle se caractérise par être non ordonnée et non répétitive.

let arr = [1, 2, 2, 3, 3, 4, 5];
let set = new Set(arr);
arr = Array.from(set);

Dans le code ci-dessus, nous définissons d'abord un tableau arr, puis le convertissons en une collection d'ensembles via la nouvelle méthode Set() et enregistrons le résultat dans la variable set. Enfin, nous convertissons la collection set en un tableau.

2. Utilisez la méthode indexOf pour dédupliquer, la méthode

indexOf peut trouver le premier index d'un élément donné dans le tableau. S'il n'est pas trouvé, il renvoie -1, nous pouvons donc utiliser cette fonctionnalité pour dédupliquer le tableau.

let arr = [1, 2, 2, 3, 3, 4, 5];
let newArr = [];
for (let i = 0; i < arr.length; i++) {
  if (newArr.indexOf(arr[i]) === -1) {
    newArr.push(arr[i]);
  }
}
arr = newArr;

Dans le code ci-dessus, nous parcourons le tableau d'origine arr à travers une boucle for. Lors de chaque parcours, nous utilisons la méthode indexOf pour trouver l'index de l'élément actuel dans le nouveau tableau newArr. Si l'index n'est pas trouvé, l'élément est ajouté à newArr.

3. Utilisez la méthode include pour supprimer les doublons

La méthode include est une nouvelle méthode dans ES7. Elle détermine si un tableau contient une valeur spécifiée et renvoie vrai ou faux. Nous pouvons effectuer des opérations de déduplication basées sur cette fonctionnalité.

let arr = [1, 2, 2, 3, 3, 4, 5];
let newArr = [];
for (let i = 0; i < arr.length; i++) {
  if (!newArr.includes(arr[i])) {
    newArr.push(arr[i]);
  }
}
arr = newArr;

Dans le code ci-dessus, nous utilisons une boucle for pour parcourir le tableau d'origine arr. Lors de chaque parcours, utilisez la méthode include pour déterminer si l'élément actuel est dans le nouveau tableau newArr. à newArr.

Résumé

Cet article présente trois méthodes courantes de déduplication de tableau dans Vue, à savoir l'utilisation des méthodes set structure, indexOf et include. Grâce à ces trois méthodes, vous pouvez facilement mettre en œuvre des opérations de déduplication de baie, améliorer l'efficacité du développement et éviter les anomalies de données. Nous pouvons choisir la méthode appropriée pour effectuer les opérations de déduplication en fonction de la situation réelle afin d'améliorer notre efficacité de développement.

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!