Probleme mit der Zeichenfolgenverkettung in JavaScript (grafisches Tutorial)

In diesem Artikel wird hauptsächlich das Problem der Zeichenfolgenverbindung in JS vorgestellt. Eines der häufigsten Probleme in ECMAScript ist die Leistung der Zeichenfolgenverbindung. Der Verbindungsvorgang wird nur ausgeführt, wenn die Methode „join()“ aufgerufen wird. Die detaillierten Erläuterungen zu den einzelnen Vorgangsschritten finden Sie unten.

Eines der häufigsten Probleme in ECMAScript ist die Leistung der String-Verkettung. Ähnlich wie bei anderen Sprachen sind ECMAScript-Strings unveränderlich, das heißt, ihre Werte können nicht geändert werden. Betrachten Sie den folgenden Code:

var str = "hello ";
str += "world";

Tatsächlich führt dieser Code die folgenden Schritte hinter den Kulissen aus:

1. Erstellen Sie den Speicher „Hallo Zeichenfolge „ “.
2. Erstellen Sie eine Zeichenfolge zum Speichern von „world“.
3. Erstellen Sie eine Zeichenfolge, um das Verbindungsergebnis zu speichern.
4. Kopieren Sie den aktuellen Inhalt von str in das Ergebnis.
5. Kopieren Sie „world“ in das Ergebnis.
6. Aktualisieren Sie str so, dass es auf das Ergebnis zeigt.

Die Schritte 2 bis 6 werden jedes Mal ausgeführt, wenn die Zeichenfolgenverkettung abgeschlossen ist, was diesen Vorgang sehr ressourcenintensiv macht. Wenn dieser Vorgang hunderte oder sogar tausende Male wiederholt wird, kann es zu Leistungsproblemen kommen. Die Lösung besteht darin, ein Array-Objekt zum Speichern der Zeichenfolge zu verwenden und dann die Methode „join()“ (Parameter ist eine leere Zeichenfolge) zu verwenden, um die endgültige Zeichenfolge zu erstellen. Stellen Sie sich vor, den vorherigen Code durch den folgenden Code zu ersetzen:

var arr = new Array();
arr[0] = "hello ";
arr[1] = "world";
var str = arr.join("");

Auf diese Weise stellt es kein Problem dar, egal wie viele Zeichenfolgen in das Array eingeführt werden , da nur die Methode join() aufgerufen wird. Erst dann wird der Verbindungsvorgang ausgeführt. Zu diesem Zeitpunkt sind die Schritte wie folgt:
1. Erstellen Sie eine Zeichenfolge zum Speichern des Ergebnisses
2. Kopieren Sie jede Zeichenfolge an die entsprechende Stelle im Ergebnis

Diese Lösung ist zwar gut, aber Es gibt einen besseren Weg. Das Problem ist, dass dieser Code nicht genau widerspiegelt, was er tun soll. Um das Verständnis zu erleichtern, können Sie diese Funktionalität mit der StringBuffer-Klasse umschließen:

function StringBuffer () {
 this._strings_ = new Array();
}
StringBuffer.prototype.append = function(str) {
 this._strings_.push(str);
};
StringBuffer.prototype.toString = function() {
 return this._strings_.join("");
};

Das erste, was Sie an diesem Code beachten sollten, ist das Strings-Attribut, das soll ein privates Attribut sein. Es gibt nur zwei Methoden, nämlich die Methoden append() und toString(). Die Methode append() verfügt über einen Parameter, der den Parameter an das String-Array anhängt. Die Methode toString() ruft die Join-Methode des Arrays auf und gibt die tatsächliche verkettete Zeichenfolge zurück. Um eine Reihe von Zeichenfolgen mithilfe eines StringBuffer-Objekts zu verketten, können Sie den folgenden Code verwenden:

var buffer = new StringBuffer ();
buffer.append("hello ");
buffer.append("world");
var result = buffer.toString();

Der folgende Code kann zum Testen des StringBuffer-Objekts und des verwendet werden traditionelle String-Verkettungsmethode. Leistung:

var d1 = new Date();
var str = "";
for (var i=0; i < 10000; i++) {
 str += "text";
}
var d2 = new Date();
document.write("Concatenation with plus: "
 + (d2.getTime() - d1.getTime()) + " milliseconds");
var buffer = new StringBuffer();
d1 = new Date();
for (var i=0; i < 10000; i++) {
 buffer.append("text");
}
var result = buffer.toString();
d2 = new Date();
document.write("<br />Concatenation with StringBuffer: "
 + (d2.getTime() - d1.getTime()) + " milliseconds");

Ich hoffe, dass es für alle hilfreich ist die Zukunft.

Verwandte Artikel:

Was sind die häufigsten Fehler, die unerfahrene JS-Benutzer machen?

Zusammenfassung der Tipps zur Verwendung von JS EventEmitter

Verwenden Sie JS zum Ziehen von Dateien

Das obige ist der detaillierte Inhalt vonProbleme mit der Zeichenfolgenverkettung in JavaScript (grafisches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!