L'épissage d'un tableau Javascript à partir de dans le callback passé à forEach

J'ai ce code qui est censé pour itérer sur chaque élément dans un tableau, de la suppression d'éléments basée sur une condition:

//iterate over all items in an array
//if the item is "b", remove it.

var array = ["a", "b", "c"];

array.forEach(function(item) {
    if(item === "b") {
        array.splice(array.indexOf(item), 1);
    }

    console.log(item);
});

De sortie souhaité:

a
b
c

De sortie réelle:

a
b

Évidemment, le natif forEach méthode n'est pas vérifier après chaque itération si l'élément a été supprimé, donc si c'est pour le prochain élément est ignoré. Est-il une meilleure façon de le faire, en dehors de substitution de la méthode forEach ou mettre mon propre classe à utiliser au lieu d'un tableau?

Modifier - pour faire suite à mon commentaire, je suppose que la solution est de simplement utiliser un standard pour la boucle. Hésitez pas à répondre si vous avez une meilleure façon.

Effectivement je peux voir pourquoi ils ne voulaient pas essayer de prendre en charge cette fonctionnalité, vous devez vérifier si l'élément supprimé est l'élément en cours, sinon, vous risquez de sauter en arrière inutilement (par exemple, si le chèque a été juste, fondée sur de savoir si la longueur avait réduit par un ou quelque chose). semble trop compliqué à mettre en œuvre.

OriginalL'auteur Gus Hogg-Blake | 2014-02-16

29

Permet de voir pourquoi JavaScript se comporte comme cela. Selon le ECMAScript spécification standard pour Array.le prototype.forEach,

lorsque vous supprimez un élément à l'index 1, l'élément à l'index 2 devient l'élément à l'index 1 index et 2 n'existe pas pour cet objet.

Maintenant, JavaScript semble pour l'élément 2 dans l'objet, qui n'est pas trouvé, donc il ignore l'appel de la fonction.

C'est pourquoi vous ne voyez que a et b.

La réelle manière de faire ceci est d'utiliser Array.le prototype.filtre
```
var array = ["a", "b", "c"];

array = array.filter(function(currentChar) {
    return currentChar !== "b";
    console.log(currentChar);   //a, b, c on separate lines
});
console.log(array);             //[ 'a', 'c' ]
```
+1 mais, si vous avez besoin d'apporter des modifications à l'élément de tableau (comme je l'ai fait dans ma situation - tableau d'objets), ainsi que de filtrer les éléments, les meilleurs à utiliser reduce.
? vous ne pouvez pas connecter rien à la console après un return déclaration
Non, vous ne pouvez pas.
c'est mon point de vue. Dans l'exemple ci-dessus, il y a un enregistrement de l'instruction après le retour.
oh, ok, désolé, j'étais pressé et n'avez pas remarqué que vous ne vous posez pas une question, mon mauvais.

OriginalL'auteur thefourtheye
11

Une possibilité serait d'utiliser la array.slice(0) fonction, ce qui crée une copie (clone) de la matrice et donc l'itération est séparé de la suppression.

Alors le seul changement à l'approche originale à l'aide de array.forEach serait à changer pour array.slice(0).forEach et cela fonctionne:
```
array.slice(0).forEach(function(item) {
    if(item === "b") {
        array.splice(array.indexOf(item), 1);
    }
    alert(item)
});
```
Après le forEach, le tableau contient uniquement a et b.

Un jsFiddle démo peut être trouvée ici.

Aussi, si vous utilisez lodash/trait de soulignement, vous pourriez faire _.clone(array).forEach(function (item) { ... })

OriginalL'auteur pasty

Tous les mentionnés ci-dessus répond simplement de ne pas ou de ne pas conserver l'original du tableau pour être passé d'ailleurs, si nous devions retirer les deux éléments à un index spécifique et continuer de l'itération de l'immédiat élément.
pour le supposez, j'ai un tableau

vehicles = [{make: ford, model: mustang}, 
            {make: chevy, model: camaro}, 
            {make: chevy, model: camaro},
            {make: ford, model: mustang},
            {make: chevy, model: camaro}]

Je veux épissure deux éléments si il ya successives combinaison de ford et chevrolet.

vehicles.forEach(function (vehicle) {
         if (vehicle) {
              var index = vehicles.indexOf(vehicle);
              var flag = vehicle.make=== "ford" && vehicles[index + 1].make=== "chevy";
              if (flag) {
                  //Array.Prototype.forEach() wouldn't update the iteration index after splice
                  vehicles.splice(index, 2, null);
              }
          }
});

Ainsi, de cette façon je suis le remplaçant le couple épissé éléments avec une valeur null pour que je puisse l'adapter à la non mise à jour des index d'itération de la boucle forEach(). Ensuite, je peux nettoyer le tableau de toute insérés les valeurs null une fois l'itération est terminée, et le tableau est prêt à être transmis.

//After all the iteration is done, we clear all the inserted null
vehicles = [].concat(vehicles.filter(Boolean));

Ce peut être un meilleur moyen de ne pas entraver quoi que ce soit et absoloutely la résolution de ce sinistre comportement de javascript.

OriginalL'auteur mr.G

Une autre possibilité serait d'utiliser la array.reduceRight fonction pour éviter l'ignorer:

//iterate over all items in an array from right to left
//if the item is "b", remove it.

const array = ["a", "b", "c"];

array.reduceRight((_, item, i) => {
    if(item === "b") {
        array.splice(i, 1);
    }

});

console.log(array);

Après la reduceRight, le tableau contient uniquement a et c.

OriginalL'auteur Elvinn

Vous devez vous connecter pour publier un commentaire.