Warum funktioniert die Spleißung nicht in dieser for-Schleife?

Question

Wenn ich versuche, dies in jsfiddle auszuführen, friert die Seite ein. jsfiddle friert auch ein, wenn ich anstelle von i einen spezifischen Index verwende (arr.splice(2,0,'limes')) oder versuche, Elemente zu entfernen (arr.splice(2,1)). Wenn ich dies ohne die for-Schleife mache und stattdessen einen bestimmten Index wähle, wird es funktionieren. Was ist hier falsch? Gibt es eine Möglichkeit, Spleiß innerhalb einer For-Schleife (Hinzufügen, nicht Entfernen von Elementen) zu machen?

Wenn ich FreeCodeCamp Editor mit diesem Code verwenden, wird es nicht einfrieren, aber es gibt mir das ursprüngliche Array zurück, als ob Spleiß nie verwendet wurde. Wenn ich ihm eine Variable zuweise (var rem = arr.splice(i,1) in einer for-Schleife), gibt es jedoch die entfernten Elemente zurück, ohne das Array selbst tatsächlich zu modifizieren (das Array bleibt genau gleich).

Answer 1

arr.splice(i,0,'limes'); 

wird Element 'Limes' injizieren vor das Element 'Birnen', Verschiebung es effektiv ein Position zum Ende des Arrays, , also auf der nächsten Iteration wird Ihr Code noch einmal 'Birnen' treffen, und injizieren Sie einen weiteren 'Limes' davor und so weiter.

Sie können dies leicht visualisieren, indem

console.log(arr); 

nach dem if-Block hinzugefügt, die in der Ausgabe wie folgt führen:

["apples", "oranges", "limes", "pears", "grapes"] 
    ["apples", "oranges", "limes", "limes", "pears", "grapes"] 
    ["apples", "oranges", "limes", "limes", "limes", "pears", "grapes"] 
    ["apples", "oranges", "limes", "limes", "limes", "limes", "pears","grapes"] 
    ... 

Answer 2

Sie haben eine Endlosschleife. Sie fügen ein neues Element vor den Birnen hinzu, anstatt es zu entfernen. Die nächste Iteration wird dir also wieder Birnen geben. Wenn das Ihre Absicht ist, fügen Sie einfach eine break-Anweisung hinzu. Wenn Sie das Element Birne ersetzen möchten, können Sie die folgende Funktion verwenden.

Von MDN

Array.splice (Start, deleteCount [, item1 [, item2 [, ...]]])

Sie können sehen, dass Sie nicht etwas zu löschen, sondern Hinzufügen eines neuen Elements vor dem Index i (dh vor Birnen).

var arr = ['apples','oranges','pears','grapes']; 
 

 
for (var i=0; i<arr.length; i++) { 
 
    if (arr[i] == 'pears') { 
 
    arr.splice(i,1,'limes'); 
 
    
 
    } 
 
} 
 

 
console.log(arr);

Answer 3

Dies ist, wie for Schleifen arbeiten:

for (var i=0; i < arr.length; i++); 

i=0; initialisieren i mit 0; Überprüfen Sie dann zu Beginn jeder Iteration diese Bedingung i < arr.length, wenn die nächste Iteration true ist, andernfalls verlassen Sie die Schleife. Am Ende jeder Iteration i++ Inkrementen i.

Da arr.splice(i,0,'limes') das Array ändern und ein Element an Position i hinzufügen, wird der Wert pears auf den nächsten Index verschoben. So wird if (arr[i] == 'pears') immer true und dieser Zustand i < arr.length wird nie false: Endless for ...