Werte im Array ändern, wenn foreach ausgeführt wird

Question

Beispiel:

var arr = ["one","two","three"];

arr.forEach(function(part){
  part = "four";
  return "four";
})

alert(arr);

Das Array ist immer noch mit seinen ursprünglichen Werten, gibt es eine Möglichkeit, Schreibzugriff auf Array-Elemente von iterierenden Funktion haben?

Answer 1

Die Funktion .forEach kann eine Callback-Funktion (eachelement, elementIndex) haben. Was Sie also im Grunde tun müssen, ist :

arr.forEach(function(element,index){
    arr[index] = "four";   //set the value  
});
console.log(arr); //the array has been overwritten.

Wenn Sie das ursprüngliche Array behalten wollen, können Sie eine Kopie davon erstellen, bevor Sie den obigen Vorgang durchführen. Um eine Kopie zu erstellen, können Sie verwenden:

var copy = arr.slice();

Answer 2

Durch den Index des Arrays ersetzen.

array[index] = new_value;

Answer 3

Um Elemente hinzuzufügen oder vollständig zu löschen, was den Index verändern würde, zählen Sie einfach die Anzahl der bereits gelöschten oder hinzugefügten Elemente und ändern Sie den Index entsprechend, in Erweiterung des Vorschlags von zhujy_8833, slice() über eine Kopie zu iterieren. Zum Beispiel, um Elemente zu löschen:

let values = ["A0", "A1", "A2", "A3", "A4", "A5", "A6", "A7", "A8"];
let count = 0;
values.slice().forEach((value, index) => {
    if (value === "A2" || value === "A5") {
        values.splice(index - count++, 1);
    };
});
console.log(values);

// Expected: [ 'A0', 'A1', 'A3', 'A4', 'A6', 'A7', 'A8' ]

Zum Einfügen von Elementen vor:

if (value === "A0" || value === "A6" || value === "A8") {
    values.splice(index - count--, 0, 'newVal');
};

// Expected: ['newVal', A0, 'A1', 'A2', 'A3', 'A4', 'A5', 'newVal', 'A6', 'A7', 'newVal', 'A8' ]

Zum Einfügen von Elementen nach:

if (value === "A0" || value === "A6" || value === "A8") {
    values.splice(index - --count, 0, 'newVal');
};

// Expected: ['A0', 'newVal', 'A1', 'A2', 'A3', 'A4', 'A5', 'A6', 'newVal', 'A7', 'A8', 'newVal']

Um ein Element zu ersetzen:

if (value === "A3" || value === "A4" || value === "A7") {
    values.splice(index, 1, 'newVal');
};

// Expected: [ 'A0', 'A1', 'A2', 'newVal', 'newVal', 'A5', 'A6', 'newVal', 'A8' ]

Hinweis: Wenn sowohl "Vorher"- als auch "Nachher"-Einfügungen implementiert werden, sollte der Code zuerst die "Vorher"-Einfügungen behandeln; andersherum wäre es nicht wie erwartet.

Answer 4

Mit den Methoden des Array-Objekts können Sie den Inhalt des Arrays ändern, doch im Vergleich zu den grundlegenden for-Schleifen fehlt diesen Methoden eine wichtige Funktion. Sie können den Index während der Ausführung nicht ändern.

Wenn Sie z. B. das aktuelle Element entfernen und an einer anderen Indexposition innerhalb desselben Arrays platzieren möchten, können Sie dies problemlos tun. Wenn Sie das aktuelle Element an eine frühere Position verschieben, ist es kein Problem, dass Sie bei der nächsten Iteration dasselbe nächste Element erhalten, als hätten Sie nichts getan.

Betrachten Sie diesen Code, in dem wir das Element an der Indexposition 5 an die Indexposition 2 verschieben, sobald der Index auf 5 hochgezählt wird.

var ar = [0,1,2,3,4,5,6,7,8,9];
ar.forEach((e,i,a) => {
i == 5 && a.splice(2,0,a.splice(i,1)[0])
console.log(i,e);
}); // 0 0 - 1 1 - 2 2 - 3 3 - 4 4 - 5 5 - 6 6 - 7 7 - 8 8 - 9 9

Wenn wir jedoch das aktuelle Element an einen Ort jenseits der aktuellen Indexposition verschieben, werden die Dinge ein wenig unübersichtlich. Dann verschiebt sich das nächste Element an die Position des verschobenen Elements, und bei der nächsten Iteration können wir es weder sehen noch auswerten.

Betrachten Sie diesen Code, in dem wir das Element an der Indexposition 5 an die Indexposition 7 verschieben, sobald der Index auf 5 hochzählt.

var a = [0,1,2,3,4,5,6,7,8,9];
a.forEach((e,i,a) => {
i == 5 && a.splice(7,0,a.splice(i,1)[0])
console.log(i,e);
}); // 0 0 - 1 1 - 2 2 - 3 3 - 4 4 - 5 5 - 6 7 - 7 5 - 8 8 - 9 9

Wir haben also nie 6 in der Schleife getroffen. Normalerweise wird in einer for-Schleife erwartet, dass Sie den Indexwert dekrementieren, wenn Sie das Array-Element nach vorne verschieben, damit Ihr Index beim nächsten Durchlauf an der gleichen Position bleibt und Sie das an die Stelle des entfernten Elements verschobene Element immer noch auswerten können. Dies ist bei Array-Methoden nicht möglich. Sie können den Index nicht ändern. Prüfen Sie den folgenden Code

var a = [0,1,2,3,4,5,6,7,8,9];
a.forEach((e,i,a) => {
i == 5 && (a.splice(7,0,a.splice(i,1)[0]), i--);
console.log(i,e);
}); // 0 0 - 1 1 - 2 2 - 3 3 - 4 4 - 4 5 - 6 7 - 7 5 - 8 8 - 9 9

Wie Sie sehen, wenn wir dekrementieren i es wird nicht bei 5, sondern bei 6 fortgesetzt, also dort, wo es verlassen wurde.

Behalten Sie dies also im Hinterkopf.

Answer 5

Wenn Sie Elemente entfernen möchten

Wenn die Änderung, die Sie vornehmen müssen, darin besteht, ein oder mehrere Elemente vollständig aus der Liste zu entfernen, ist es sicherer, wenn Sie eine for Schleife und gehen rückwärts durch die Schleife.

    for (let i = myArray.length - 1; i >= 0; i--)
    {
        const item = myArray[i];

        if (...) 
        {
           // remove item
           // https://stackoverflow.com/questions/5767325/how-can-i-remove-a-specific-item-from-an-array?rq=1
        }
    };

Rückwärts zu gehen bedeutet, dass sich die Anordnung der einzelnen Elemente nie ändert. Wenn Sie vorwärts durch eine Schleife gehen und löschen item[3] dann item[4] ist jetzt der neue item[3] was die Sache nicht einfacher macht. Beim Rückwärtsfahren haben Sie dieses Problem nicht.

Dies ist natürlich eine Lösung, bei der foreach nicht verwendet wird, aber es ist wichtig, sich daran zu erinnern, dass "altmodische" Methoden oft die besten sein können. Und wenn Sie aus irgendeinem Grund break; aus der Schleife (und es gibt mehr als eine Handvoll Elemente) ist eine for-Schleife effizienter, da man aus einer for-Schleife nicht ausbrechen kann.