So indizieren, teilen und bearbeiten Sie Zeichenfolgen in JavaScript

Einführung

Eine Zeichenfolge ist eine Sequenz von einem oder mehreren Zeichen, die aus Buchstaben, Zahlen oder Symbolen bestehen kann. Auf jedes Zeichen in einer JavaScript-Zeichenfolge kann über eine Indexnummer zugegriffen werden, und allen Zeichenfolgen stehen Methoden und Eigenschaften zur Verfügung.

In diesem Tutorial lernen wir den Unterschied zwischen Zeichenfolgenprimitiven und dem Zeichenfolgenobjekt kennen, wie Zeichenfolgen indiziert werden, wie auf Zeichen in einer Zeichenfolge zugegriffen wird und welche allgemeinen Eigenschaften und Methoden für Zeichenfolgen verwendet werden.

Zeichenfolgenprimitive und Zeichenfolgenobjekte

Zuerst werden wir die beiden Arten von Zeichenfolgen klären. JavaScript unterscheidet zwischen der Zeichenfolgenprimitive, einem unveränderlichen Datentyp und dem Zeichenfolgenobjekt.

Um den Unterschied zwischen den beiden zu testen, initialisieren wir eine Zeichenfolgenprimitive und ein Zeichenfolgenobjekt.

// Initializing a new string primitive
const stringPrimitive = 'A new string.'

// Initializing a new String object
const stringObject = new String('A new string.')

Wir können den Operator typeof verwenden, um den Typ eines Werts zu bestimmen. Im ersten Beispiel haben wir einer Variable einfach eine Zeichenfolge zugewiesen.

typeof stringPrimitive

Output
string

Im zweiten Beispiel haben wir eine neue Zeichenfolge() verwendet, um ein Zeichenfolgenobjekt zu erstellen und einer Variable zuzuweisen.

typeof stringObject

Output
object

Meistens erstellen Sie Zeichenfolgenprimitive. JavaScript kann auf die integrierten Eigenschaften und Methoden des Zeichenfolgen``objekt-Wrappers zugreifen und diese verwenden, ohne die von Ihnen erstellte Zeichenfolgenprimitive tatsächlich in ein Objekt zu ändern.

Während dieses Konzepts zunächst etwas anspruchsvoll ist, sollten Sie sich der Unterscheidung zwischen Primitive und Objekt bewusst sein. Im Wesentlichen stehen allen Zeichenfolgen Methoden und Eigenschaften zur Verfügung. Im Hintergrund führt JavaScript bei jedem Aufruf einer Methode oder Eigenschaft eine Konvertierung in ein Objekt und zurück in eine Primitive durch.

Wie Zeichenfolgen indiziert sind

Jedes der Zeichen in einer Zeichenfolge entspricht einer Indexnummer, beginnend mit 0.

Zur Demonstration erstellen wir eine Zeichenfolge mit dem Wert How are you?.

Das erste Zeichen in der Zeichenfolge ist H, was dem Index 0 entspricht. Das letzte Zeichen ist ?, was 11 entspricht. Die Leerzeichen haben auch einen Index bei 3 und 7.

Wenn wir auf jedes Zeichen in einer Zeichenfolge zugreifen können, haben wir verschiedene Möglichkeiten, mit Zeichenfolgen zu arbeiten und diese zu bearbeiten.

Zugriff auf Zeichen

Wir zeigen Ihnen, wie Sie auf Zeichen und Indizes mit der Zeichenfolge How are you? zugreifen können.

'How are you?'

Mit der quadratischen Klammernotation können wir auf jedes Zeichen in der Zeichenfolge zugreifen.

'How are you?'[5]

Output
r

Wir können auch die charAt()-Methode verwenden, um das Zeichen mit der Indexnummer als Parameter zurückzugeben.

'How are you?'.charAt(5)

Output
r

Alternativ können wir indexOf() verwenden, um die Indexnummer durch die erste Instanz eines Zeichens zurückzugeben.

'How are you?'.indexOf('o')

Output
1

Obwohl „o“ zweimal in der Zeichenfolge How are you? erscheint, erhält indexOf() die erste Instanz.

lastIndexOf() wird verwendet, um die letzte Instanz zu finden.

'How are you?'.lastIndexOf('o')

Output
9

Für beide Methoden können Sie auch nach mehreren Zeichen in der Zeichenfolge suchen. Sie gibt die Indexnummer des ersten Zeichens in der Instanz zurück.

'How are you?'.indexOf('are')

Output
4

Die slice()-Methode hingegen gibt die Zeichen zwischen zwei Indexnummern zurück. Der erste Parameter ist die Startindexnummer und der zweite Parameter ist die Indexnummer, an der sie enden soll.

'How are you?'.slice(8, 11)

Output
you

Beachten Sie, dass 11 ? ist, aber ? ist nicht Teil der zurückgegebenen Ausgabe. slice() gibt zurück, was zwischen dem letzten Parameter liegt, schließt ihn jedoch nicht ein.

Wenn ein zweiter Parameter nicht enthalten ist, gibt slice() alles vom Parameter bis zum Ende der Zeichenfolge zurück.

'How are you?'.slice(8)

Output
you?

Zusammenfassend helfen charAt() und slice() dabei, Zeichenfolgenwerte basierend auf Indexnummern zurückzugeben, und indexOf() und lastIndexOf() machen das Gegenteil und geben Indexnummern basierend auf den angegebenen Zeichenfolgen zurück.

Die Länge einer Zeichenfolge finden

Mit der Eigenschaft length können wir die Anzahl der Zeichen in einer Zeichenfolge zurückgeben.

'How are you?'.length

Output
12

Denken Sie daran, dass die Eigenschaft length die tatsächliche Anzahl von Zeichen zurückgibt, die mit 1 beginnen, was 12 ergibt, und nicht die endgültige Indexnummer, die bei 0 beginnt und bei 11 endet.

Konvertieren in Groß- oder Kleinschreibung

Die beiden integrierten Methoden toUpperCase() und toLowerCase() sind hilfreiche Möglichkeiten, um Text zu formatieren und Textvergleiche in JavaScript zu erstellen.

toUpperCase() konvertiert alle Zeichen in Großbuchstaben.

'How are you?'.toUpperCase()

Output
HOW ARE YOU?

toLowerCase() konvertiert alle Zeichen in Kleinbuchstaben.

'How are you?'.toLowerCase()

Output
how are you?

Diese beiden Formatierungsmethoden nehmen keine zusätzlichen Parameter.

Es lohnt sich, zu beachten, dass diese Methoden die ursprüngliche Zeichenfolge nicht ändern.

Zeichenfolgen teilen

JavaScript bietet eine sehr nützliche Methode, um eine Zeichenfolge durch ein Zeichen zu teilen und aus den Abschnitten eine neue Anordnung zu erstellen. Wir verwenden die split()-Methode, um die Anordnung durch ein Leerzeichen zu trennen, das durch „“ dargestellt ist.

const originalString = 'How are you?'

// Split string by whitespace character
const splitString = originalString.split(' ')

console.log(splitString)

Output
[ 'How', 'are', 'you?' ]

Nachdem wir eine neue Anordnung in der splitString-Variablen haben, können wir auf jeden Abschnitt mit einer Indexnummer zugreifen.

splitString[1]

Output
are

Wenn ein leerer Parameter angegeben ist, erstellt split() eine durch Komma getrennte Anordnung mit jedem Zeichen in der Zeichenfolge.

Durch die Trennung von Zeichenfolgen können Sie bestimmen, wie viele Wörter sich in einer Satz befinden und die Methode als Möglichkeit verwenden, um beispielsweise die Vornamen und die Nachnamen von Leuten zu bestimmen.

Leerzeichen kürzen

Die JavaScript-Methode trim() entfernt Leerzeichen an beiden Enden einer Zeichenfolge, jedoch nicht irgendwo dazwischen. Leerzeichen können Tabulatoren oder Leerzeichen sein.

const tooMuchWhitespace = '     How are you?     '

const trimmed = tooMuchWhitespace.trim()

console.log(trimmed)

Output
How are you?

Die trim()-Methode ist eine einfache Möglichkeit, die gemeinsame Aufgabe auszuführen, um überschüssige Leerzeichen zu entfernen.

Zeichenfolgenwerte suchen und ersetzen

Wir können eine Zeichenfolge nach einem Wert durchsuchen und ihn mithilfe der replace() -Methode durch einen neuen Wert ersetzen. Der erste Parameter ist der zu findende Wert und der zweite Parameter ist der Wert, der ihn ersetzen kann.

const originalString = 'How are you?'

// Replace the first instance of "How" with "Where"
const newString = originalString.replace('How', 'Where')

console.log(newString)

Output
Where are you?

Wir können nicht nur einen Wert durch einen anderen Zeichenfolgenwert ersetzen, sondern auch reguläre Ausdrücke verwenden, um replace() leistungsfähiger zu machen. Zum Beispiel wirkt sich replace() nur auf den ersten Wert aus, aber wir können das Flag g (global) verwenden, um alle Instanzen eines Werts abzufangen, und das Flag i (ohne Berücksichtigung der Groß- und Kleinschreibung), um Groß- und Kleinschreibung zu ignorieren.

const originalString =
  "Javascript is a programming language. I'm learning javascript."

// Search string for "javascript" and replace with "JavaScript"
const newString = originalString.replace(/javascript/gi, 'JavaScript')

console.log(newString)

Output
JavaScript is a programming language. I'm learning JavaScript.

Dies ist eine sehr häufige Aufgabe, die reguläre Ausdrücke verwendet. Besuchen Sie Regexr, um weitere Beispiele für RegEx zu üben.

Zusammenfassung

Zeichenfolgen sind einer der am häufigsten verwendeten Datentypen, und es gibt eine Menge, was wir mit ihnen tun können.

In diesem Tutorial haben wir den Unterschied zwischen der Zeichenfolgenprimitive und dem Zeichenfolgenobjekt kennengelernt, wie Zeichenfolgen indiziert werden und wie die integrierten Methoden und Eigenschaften von Zeichenfolgen verwendet werden, um auf Zeichen zuzugreifen, Text zu formatieren und Werte zu suchen und zu ersetzen.

Eine allgemeinere Übersicht über Zeichenfolgen finden Sie im Lernprogramm „So arbeiten Sie mit Zeichenfolgen in JavaScript“.