Hier ist ein einfacher Artikel über einige Tipps zur Verwendung von JavaScript -Arrays. Wir werden verschiedene Methoden verwenden, um zwei JS -Arrays zu kombinieren/zusammenzuführen und die Vor-/Nachteile jeder Methode zu diskutieren.
Betrachten wir zuerst die folgende Situation:
Die Codekopie lautet wie folgt:
var a = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var b = ["foo", "bar", "baz", "bam", "bun", "fun"];
Offensichtlich sollte das einfachste Kombinationsergebnis sein:
Die Codekopie lautet wie folgt:
[
1, 2, 3, 4, 5, 6, 7, 8, 9,
"Foo", "Bar", "Baz", "Bam" "Bun", "Spaß"
]
concat (..)
Dies ist die häufigste Praxis:
Die Codekopie lautet wie folgt:
var c = a.concat (b);
A; // [1,2,3,4,5,6,7,8,9]
B; // ["Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
C; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
Wie Sie sehen können, ist C ein brandneues Array, das eine Kombination aus zwei Arrays A und B darstellt und A und B invariante hält. Einfach?
Aber wenn A 10.000 Elemente und B 10.000 Elemente hat? C wird 20.000 Elemente haben, daher wird sich die Speicherverwendung von A und B verdoppeln.
"Kein Problem!" du sagtest. Lassen Sie sie Müll gesammelt, setzt A und B zu Null, das Problem ist gelöst!
Die Codekopie lautet wie folgt:
a = b = null; // 'a' und 'b' werden recycelt
hehe. Für kleine Arrays mit nur wenigen Elementen ist dies in Ordnung. Für große Arrays oder Systeme mit begrenztem Speicher muss dieser Vorgang häufig wiederholt werden, er hat tatsächlich viele Verbesserungen.
Schleifeninsertion
Ok, kopieren wir den Inhalt eines Arrays in ein anderes mit: Array#Push (..)
Die Codekopie lautet wie folgt:
// `b` auf` a`
für (var i = 0; i <B.Length; i ++) {
A.push (b [i]);
}
A; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
B = NULL;
Jetzt hat Array A den Inhalt von Array b.
Es scheint einen besseren Speicherpflichtigen zu geben.
Aber was ist, wenn das Array A kleiner ist? Aus Gedächtnis- und Geschwindigkeitsgründen möchten Sie vielleicht kleineres A vor B stellen. Kein Problem, wechseln Sie einfach Push (..) in das Entschieben (..):
Die Codekopie lautet wie folgt:
// `a` in` b`:
für (var i = a.Length-1; i> = 0; i--) {
B.unshift (a [i]);
}
B; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
Funktionale Fähigkeiten
Die für Schleife ist jedoch in der Tat hässlich und schwer zu bewahren. Können wir es besser machen?
Dies ist unser erster Versuch mit Array#Reduzieren:
Die Codekopie lautet wie folgt:
// `b` auf` a`:
A = B.Rece (Funktion (Coll, Element) {
Coll.push (Artikel);
return coll;
}, A );
A; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
// oder `a` in` b`:
B = A.Reduceright (Funktion (Coll, Element) {
Coll.Unshift (Artikel);
return coll;
}, B );
B; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
Array#Reduzieren (..) und Array#Reduderight (..) sind nett, aber sie sind ein bisschen ungeschickt. Die Pfeilfunktion von ES6 => verringert die Codemenge, erfordert jedoch immer noch eine Funktion, und jedes Element muss einmal aufgerufen werden, was nicht perfekt ist.
Also wie wäre es damit:
Die Codekopie lautet wie folgt:
// `b` auf` a`:
A.push.Apply (a, b);
A; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
// oder `a` in` b`:
B.Unshift.Apply (b, a);
B; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]
Ist das ein viel besserer Ort? Vor allem, weil sich die nicht geschichtete (..) Methode nicht um die vorherige umgekehrte Sortierung sorgen muss. Die Sprachoperation des ES6 wird schöner sein: a.push (... b) oder b.unshift (... a
Maximale Längengrenze für das Array
Das erste große Problem ist, dass das Speicherverbrauch verdoppelt wird (natürlich nur vorübergehend!), Kopiert Elemente im Grunde genommen über Funktionsaufrufe in den Stapel. Darüber hinaus haben verschiedene JS -Motoren Einschränkungen hinsichtlich der Länge der Kopierdaten.
Wenn das Array also über eine Million Elemente verfügt, werden Sie definitiv die Grenze überschreiten, die (...) oder nicht geschaltet (...) den Anrufstapel ermöglicht. Leider wird es großartige Arbeit leisten, um Tausende von Elementen zu bearbeiten, aber Sie müssen darauf achten, die angemessene Längengrenze nicht zu überschreiten.
HINWEIS: Sie können Splice (...) versuchen, das dieses Problem wie Push (...) und Unschuh (...) hat.
Es gibt eine Möglichkeit, diese maximale Längengrenze zu vermeiden.
Die Codekopie lautet wie folgt:
Funktion combineInto (a, b) {
var len = a.länge;
für (var i = 0; i <len; i = i+5000) {
B.Unshift.Apply (B, A.Slice (i, i+5000));
}
}
Warten Sie, unsere Lesbarkeit ist zurückgegangen. Das ist es, es kann immer schlimmer werden, haha.