Vier praktische Tipps für JavaScript-String-Operationen

Vorwort

Zeichenfolgen sind einer der grundlegendsten und wichtigsten Datentypen in der Programmierwelt und JavaScript ist keine Ausnahme. JavaScript-Strings sind unveränderlich und eignen sich zum Speichern von Text, der aus Zeichen, Zahlen und Unicode bestehen kann. JavaScript bietet viele integrierte Funktionen, mit denen Zeichenfolgen auf unterschiedliche Weise erstellt und bearbeitet werden können. In diesem Artikel gebe ich einige Tipps zur eleganten Bearbeitung von JavaScript-Strings.

1. Eine Zeichenfolge teilen

Die Methode split() in JavaScript teilt ein String-Objekt unter Verwendung einer angegebenen Trennzeichenfolge in ein Array von Teilzeichenfolgen auf, wobei eine angegebene Teilungszeichenfolge die Position jeder Teilung bestimmt. Mit zwei optionalen Parametern (Trennzeichen und optionale Begrenzungsanzahl) wird der String in ein Array von Zeichen oder Teilstrings umgewandelt. Wenn kein Trennzeichen gesetzt wird, wird der komplette String in einem Array zurückgegeben. Das Trennzeichen kann ein einzelnes Zeichen, eine Zeichenfolge oder sogar ein regulärer Ausdruck sein. Hier ist der Code, der die Zeichenfolge mithilfe von Kommas und Leerzeichen und regulären Ausdrücken aufteilt:

const title = "4 JavaScript-String-Tricks";
console.log(title.split(/[\s+，/]+/)); // ['4', 'JavaScript', 'String-Kenntnisse']
Konsole.log(Titel.split(/[\s+，/]+/, 2)); // [ '4', 'JavaScript' ]

Mit der Funktion split() geteilte Zeichenfolgen können einfach durch die Verwendung von join("") zusammengeführt werden.

2. JSON-Formatierung und -Analyse

JSON ist kein reiner JavaScript-Datentyp und wird häufig für die Front-End- und Back-End-Dateninteraktion verwendet. Die Funktion JSON.stringify() wird verwendet, um ein Objekt in eine Zeichenfolge im JSON-Format zu konvertieren. Normalerweise übergeben Sie das Objekt einfach als Parameter, etwa so:

const Artikel = {
    Titel: „JavaScript-String-Kenntnisse“,
    Ansicht: 30000,
    Kommentare: null,
    Inhalt: undefiniert,
};
const strArticle = JSON.stringify(Artikel); 

console.log(strArticle); // {"title":"JavaScript-String-Kenntnisse","view":30000,"comments":null}

Wie man dem obigen Code entnehmen kann, werden in stringify undefinierte Werte herausgefiltert, Nullwerte jedoch nicht.

JSON.stringify() kann zwei optionale Parameter akzeptieren, der zweite ist ein Ersetzungsparameter, bei dem Sie ein Array von zu druckenden Schlüsseln oder eine Funktion zum Löschen dieser Schlüssel angeben können. Der folgende Code:

console.log(JSON.stringify(Artikel, ["Titel", "Kommentare"])); // {"Titel":"JavaScript-String-Techniken","Kommentare":null}
konsole.log(JSON.stringify(Artikel, [])); // {}

Bei einem großen JSON-Code kann die Übergabe eines langen Arrays die Lesbarkeit und Effizienz beeinträchtigen. Sie können daher eine Ersetzungsfunktion festlegen und für die Schlüssel, die Sie überspringen möchten, „undefined“ wie folgt zurückgeben:

const Ergebnis = JSON.stringify(Artikel, (Schlüssel, Wert) =>
    Schlüssel === "Titel" ? undefiniert : Wert
);
console.log(Ergebnis); // {"Ansicht":30000,"Kommentare":null}

Das dritte Argument für JSON.stringify() formatiert das JSON durch Angabe der Einrückung (nützlich bei verschachtelten Blöcken). Sie können eine Zahl übergeben, um den Einrückungsabstand festzulegen, oder sogar eine Zeichenfolge, durch die Leerzeichen ersetzt werden sollen. Der folgende Code:

console.log(JSON.stringify(Artikel, ["Titel"], "\t")); 

Die Ausgabe erfolgt im folgenden Format:

{
"Titel": "JavaScript-String-Tricks"
}

Es gibt auch eine JSON.parse()-Funktion, die eine JSON-Zeichenfolge nimmt und in ein JavaScript-Objekt konvertiert. Es akzeptiert auch eine Reviver-Funktion, die Objekteigenschaften abfangen und die Eigenschaftswerte ändern kann, bevor der Wert zurückgegeben wird.

const reviver = (Schlüssel, Wert) => (Schlüssel === "Ansicht" ? 0 : Wert);

var jsonString = JSON.stringify(Artikel);
var jsonObj = JSON.parse(jsonString, reviver);

console.log(jsonObj); // { Titel: 'JavaScript-String-Techniken', Ansicht: 0, Kommentare: null }

3. Mehrzeilige Zeichenfolgen und eingebettete Ausdrücke

Es gibt drei Möglichkeiten, Zeichenfolgen in JavaScript zu erstellen: mit einfachen Anführungszeichen '', doppelten Anführungszeichen "" oder Backticks (oben links auf der Tastatur, links von 1).

const Länder1 = "China";
const Länder2 = "China";
const Länder3 = „China“;

Die ersten beiden werden im Wesentlichen auf die gleiche Weise erstellt und können gemischt und angepasst werden, um in Anführungszeichen gesetzte Zeichenfolgen zu verketten oder hinzuzufügen (durch Verwendung des entgegengesetzten Syntaxstils), während Backticks ausgefallene und leistungsstarke Manipulationen von Zeichenfolgen ermöglichen.

Backticks werden auch als Template-Literale bezeichnet. Backticks sind praktisch, um mehrzeilige Strings zu erstellen und Ausdrücke einzubetten. So erstellen Sie mithilfe der Zeichenfolgeninterpolation in JavaScript eine mehrzeilige Zeichenfolge:

konstantes Jahr = "2021";
const Monat = 7;
const Tag = 2;
const detail = `Heute ist ${year}${month}${day},
Es ist ein guter Tag! `;

konsole.log(detail);

Die Ausgabeergebnisse werden außerdem wie folgt umbrochen:

Heute ist der 2. Juli 2021.
Es ist ein guter Tag!

Zusätzlich zu Zeichenfolgenliteralen ist innerhalb von ${} jeder gültige Ausdruck zulässig. Dabei kann es sich um einen Funktionsaufruf oder Ausdruck oder sogar eine verschachtelte Vorlage handeln.
Markierte Vorlagen sind eine erweiterte Form von Vorlagenliteralen, die die Analyse des Vorlagenliterals mithilfe einer Funktion mit eingebetteten Ausdrücken als Argumenten ermöglichen. Der folgende Code:

const title = "JavaScript-String-Tipps";
const-Ansicht = 30000;

const detail = (Text, Titel-Exp, Ansichts-Exp) => {
    const [Zeichenfolge1, Zeichenfolge2, Zeichenfolge3] = [...Text];
    gibt `${string1}${titleExp}${string2}${viewExp}${string3}` zurück;
};

const intro = detail`Der Titel dieses Artikels ist "${title}", und der aktuelle Leseumfang ist: ${view}`;

console.log(intro); // Der Titel des Artikels lautet „JavaScript String Skills“ und das aktuelle Lesevolumen beträgt: 30000

4. Überprüfen Sie, ob eine Teilzeichenfolge in einem Zeichenfolgenarray vorhanden ist

In ES6 lässt sich ganz einfach herausfinden, ob in einer JavaScript-Zeichenfolge eine Teilzeichenfolge vorhanden ist. Verwenden Sie dazu einfach die Funktion „Includes“.

Sie müssen jedoch überprüfen, ob die Zeichenfolge in den Daten vorhanden ist. Wenn eines der Elemente im Hauptarray sie enthält, wird „true“ zurückgegeben. Wenn keines der Elemente sie enthält, wird „false“ zurückgegeben. Daher müssen Sie die Funktion „some“ zusammen mit „includes“ verwenden, wie im folgenden Code gezeigt:

const arrayTitles = ["Javascript", "EScript", "Golang"];
const hasText = (Array, findeText) =>
    array.some((Element) => Element.includes(Text finden));

console.log(hasText(arrayTitles, "script")); // wahr
console.log(hasText(arrayTitles, "php")); // falsch

Zusammenfassen

JavaScript-String-Operationen sind in Projekten häufige Operationen. Die oben genannten 4 Tipps sind es wert, gelernt und in der tatsächlichen Entwicklung angewendet zu werden.

Damit ist dieser Artikel mit vier praktischen Tipps zur JavaScript-Zeichenfolgenmanipulation abgeschlossen. Weitere relevante Tipps zur JS-Zeichenfolgenmanipulation finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!