JavaScript Strings

In JavaScript werden die Strings zum Speichern und Manipulieren von Text verwendet. Es gibt keinen separaten Typ für ein einzelnes Zeichen. Das interne Format der Strings ist immer UTF-16.

Ein String repräsentiert null oder mehr Zeichen, die in Anführungszeichen geschrieben sind.

Über Anführungszeichen

Wir unterscheiden zwischen einfachen Anführungszeichen, doppelten Anführungszeichen und Backticks:

let single = 'single-quoted';
let double = "double-quoted"; 
let backticks = `backticks`;

Doppelte und einfache Anführungszeichen sind gleich. Trotzdem, Backticks sind anders. Sie können sie verwenden, um einen Ausdruck in den String einzufügen, indem Sie ihn in ${…} einpacken, wie folgt:

Strings in javascript
let str = "W3Docs"; console.log(`Welcome to ${str}`); // Welcome to W3Docs

Einer der entscheidenden Vorteile von Backticks besteht darin, dass sie es erlauben, einen String über mehrere Zeilen hinweg zu strecken, wie folgt:

Strings in javascript
let languagesList = `Languages: * Javascript * Php * Java `; console.log(languagesList); // a list of languages, multiple lines

Aber beachten Sie, dass einzelne und doppelte Anführungszeichen in diesem Fall nicht funktionieren. Wenn Sie versuchen, sie für mehrere Zeilen anzuwenden, tritt ein Fehler auf:

let guestList = "Guests: // Error: Unexpected token ILLEGAL 
* John ";

Einfache und doppelte Anführungszeichen gab es schon vor den Backticks. Daher sind die Backticks funktionsreicher.

Sie können auch eine “Template-Funktion” vor dem ersten Backtick angeben. Die Syntax sieht so aus:

func `string`

In der Regel wird die func Funktion automatisch aufgerufen. Sie empfängt sowohl den String als auch die eingebetteten Ausdrücke und verarbeitet sie. Mit dieser Funktion können Sie schnell benutzerdefinierte Vorlagen implementieren. Dennoch wird sie in der Praxis kaum genutzt.

Sonderzeichen

Sie können mehrzeilige Strings mit doppelten und einfachen Anführungszeichen mit Hilfe von \n erstellen, wie folgt:

Strings in javascript
let languagesList = "Languages:\n * Javascript\n * Php\n * Java"; console.log(languagesList); // a multiline list of languages

Es gibt auch andere, weniger gebräuchliche Sonderzeichen.

Einige davon finden Sie in der folgenden Liste:

  • \', \" Diese Sonderzeichen werden für Anführungszeichen verwendet
  • \r - Wagenrücklauf. Dieses Zeichen wird heute allein nicht mehr verwendet. Eine Kombination von zwei Zeichen \r\n wird verwendet, um einen Zeilenumbruch in Windows-Textdateien darzustellen.
  • \\ - umgekehrter Schrägstrich
  • \t - Tabulator
  • \xXX - Unicode-Zeichen mit einem bestimmten hexadezimalen Unicode XX
  • \uXXXX - dies ist ein Unicode-Symbol mit dem Hex-Code XXXX in UTF-16-Kodierung. Es muss genau 4 Ziffern enthalten.

Hier sind Beispiele mit Unicodes:

Unicode strings in javascript
console.log("\u00E9"); // é console.log("\u{03BB}"); // λ

Bitte beachten Sie, dass alle Sonderzeichen mit einem Rückstrich beginnen. Dies wird auch als "Escape-Zeichen" bekannt.

Sie können es auch verwenden, wenn Sie ein Anführungszeichen in den String einfügen möchten.

Hier ist ein Beispiel:

Strings in javascript
console.log('This\'s the W3Docs site!'); // This’s the W3Docs site

Bedenken Sie außerdem, dass der Rückstrich hauptsächlich dazu dient, das Lesen des Strings durch JavaScript zu korrigieren, woraufhin er verschwindet. Im String-Speicher können Sie kein \ finden. Wenn Sie jedoch einen tatsächlichen Rückstrich innerhalb des Strings anzeigen müssen, sollten Sie ihn doppeln, wie in diesem Beispiel:

Strings in javascript
console.log(`The backslash: \\`); // The backslash: \ let backslash = "aa ///\\"; // This is correct // let backslash = "aa ///\"; // This is not. console.log(backslash);

Die String-Länge

Die Eigenschaft length wird verwendet, um die Länge eines Strings zu ermitteln:

Strings length in javascript
console.log(`W3Docs\n`.length); // 7

Bedenken Sie, dass \n ein Sonderzeichen ist. Daher sollte die Länge 7 sein.

Manchmal schreiben Entwickler die Eigenschaft falsch, indem sie str.length() anstelle von einfach str.length aufrufen. Das funktioniert nicht.

Auf Zeichen zugreifen

Eckige Klammern[pos] werden hauptsächlich verwendet, um ein Zeichen an der Position [pos] zu erhalten. Sie können dies auch tun, indem Sie die Methode str.charAt(pos) aufrufen. Das allererste Zeichen sollte von null anfangen:

Character at a position strings in javascript
let str = `Welcome`; // the first character console.log(str[0]); // W console.log(str.charAt(0)); // W // the last character console.log(str[str.length - 1]); // e

Moderne Entwickler bevorzugen die Verwendung von eckigen Klammern, während die charAt selten verwendet wird

Strings sind unveränderlich

In JavaScript ist es nicht möglich, die Strings zu ändern. Schauen Sie sich dieses Beispiel an, um sicherzustellen, dass es nicht funktioniert:

Change character at a position strings in javascript
let str = 'Welcome'; str[0] = 'w'; console.log(str[0]);

Die gängige Praxis besteht darin, einen ganz neuen String zu erstellen und ihn anstelle des alten an str zuzuweisen, wie folgt:

Character at a position strings in javascript
let str = 'Hi'; str = 'h' + str[1]; // replace the string console.log(str); // hi

Groß- und Kleinschreibung ändern

Es gibt zwei Methoden, um die Groß- und Kleinschreibung zu ändern. Hier sind sie:

toUpperCase change strings in javascript
console.log('Welcome to W3Docs'.toUpperCase()); // WELCOME TO W3DOCS console.log('Welcome to W3Docs'.toLowerCase()); // welcome to w3docs

In einem anderen Szenario, wenn nur ein einzelnes Zeichen kleingeschrieben werden soll, verwenden Sie diese Methode:

toLowerCase change strings in javascript
console.log('Welcome to W3Docs' [0].toLowerCase()); // 'w'

Nach einem Teilstring suchen

Lassen Sie uns die Möglichkeiten entdecken, wie man nach einem Teilstring innerhalb eines Strings sucht.

str.indexOf

Diese Methode wird verwendet, um den substr in str zu suchen. Sie beginnt an einer bestimmten Position pos und gibt diese Position zurück, wenn ein Übereinstimmung gefunden wird, oder -1, wenn nichts gefunden wird.

Schauen wir uns das folgende Beispiel an:

Index strings in javascript
let str = 'Welcome to W3Docs'; console.log(str.indexOf('Welcome')); // 0, because 'Welcome' is found at the beginning console.log(str.indexOf('welcome')); // -1, not found, the search is case-sensitive console.log(str.indexOf("W3Docs")); // 11, "W3Docs" is found at the position 11

str.lastIndexOf(substr, position)

Diese Methode sucht vom Ende des Strings zum Anfang. Die Vorkommen werden in umgekehrter Reihenfolge aufgelistet.

Bedenken Sie eine leichte Schwierigkeit mit indexOf im if-Test. Es kann nicht auf diese Weise in if eingefügt werden:

Index strings in javascript
let str = "Welcome to W3Docs"; if (str.indexOf("Welcome")) { console.log("Thank you"); // doesn't work! }

Also ist es notwendig, nach -1 zu suchen, wie folgt:

Index strings in javascript
let str = "Welcome to W3Docs"; if (str.indexOf("Welcome") != -1) { console.log("Thank you"); // works now }

Includes, startsWith, endsWith

Die zeitgemäßere Methode str.includes(substr, pos) gibt dann true/false zurück, ob ein substr in str gefunden wurde.

Verfahren Sie wie im Beispiel, wenn Sie einen Übereinstimmungstest benötigen, ohne gleichzeitig seine Position zu benötigen:

Includes strings in javascript
console.log("Welcome to W3Docs".includes("Welcome")); // true console.log("Hi".includes("Bye")); // false

Das zweite Argument von str.includes ist die Position, von der Sie mit der Suche beginnen. Hier ist ein Beispiel:

Includes strings in javascript
console.log("Welcome".includes("come")); // true console.log("Welcome".includes("come", 5)); // false, from position 5 there is no "come"

Einen Teilstring bekommen

JavaScript bietet drei Methoden zum Abrufen eines Teilstrings: substring, substr und slice.

str.slice(start [, end])

Diese Methode wird verwendet, um den Teil des Strings von start bis end zurückzugeben.

Beispiel:

The slice method in javascript strings
let str = "welcome"; console.log(str.slice(0, 6)); // 'welcom', the substring from 0 to 6 (not including 6) console.log(str.slice(0, 1)); // 'w', from 0 to 1, but not including 1, so only character at 0

Wenn das zweite Argument fehlt, wird slice bis zum Ende gehen, wie folgt:

Slice in javascript strings
let str = "welcome"; console.log(str.slice(3)); // 'come', from the 3-position till the end

Für start/end können Sie auch negative Werte verwenden.

Zum Beispiel:

The slice in javascript strings
let str = "welcome "; // start at the 5th position from the right, end at the 1st from the right console.log(str.slice(-5, -1)); // 'come'

str.substring(start [, end])

Diese Methode wird verwendet, um den Teil des Strings zwischen dem start und dem end zurückzugeben.

Es sieht sehr nach slice aus. Der bemerkenswerteste Unterschied ist, dass bei dieser Methode der start größer als das end sein kann.

Beispiel:

The substring in javascript strings
let str = "welcome"; // these are same for substring console.log(str.substring(3, 6)); // "com" console.log(str.substring(6, 3)); // "com" // ...but not for slice: console.log(str.slice(3, 6)); // "com" (the same) console.log(str.slice(6, 3)); // "" (an empty string)

str.substr(start [, length])

Diese Methode gibt den Teil des Strings aus dem start mit einer bestimmten Länge zurück. Sie unterscheidet sich von den vorherigen Methoden. Diese Methode hilft Ihnen, die length anstelle der Endposition anzugeben.

Beispiel:

The substr in javascript strings
let str = "welcome"; console.log(str.substr(3, 4)); // 'come', from the 3-position get 4 characters

Das erste Argument könnte negativ sein, um vom Ende zu zählen:

The substr in javascript strings
let str = "welcome"; console.log(str.substr(-4, 2)); // 'co', from the 4th position get 2 characters

Vergleich der Strings

Es ist wichtig zu wissen, dass Strings zeichenweise in alphabetischer Reihenfolge verglichen werden.

Sie sollten auch die folgenden Eigenschaften in Betracht ziehen:

  1. Kleinbuchstaben sind größer als Großbuchstaben, wie folgt:
    Comparison in javascript strings
    console.log('a' > 'Z'); // true
  2. Buchstaben mit diakritischen Zeichen gelten als "außer der Reihe".

Beispiel:

Comparison in javascript strings
console.log('Germany' > 'England'); // true

Betrachten wir nun die interne Darstellung von Strings in JavaScript.

In JavaScript kodieren wir alle Strings mit UTF-16. Das bedeutet, dass jedem Zeichen ein entsprechender numerischer Code zugeordnet ist.

str.codePointAt(pos)

Es wird verwendet, um den Code für das Zeichen an der Position pos zurückzugeben:

Return the code for the character at position javascript string
// different case letters have different codes console.log("w".codePointAt(0)); // 119 console.log("W".codePointAt(0)); // 87

String.fromCodePoint(code)

Erzeugt ein Zeichen aus dem numerischen Code:

Character's numeric code javascript string
console.log(String.fromCodePoint(80)); // P

Unicode-Zeichen können auch durch ihre Codes hinzugefügt werden, indem man \u gefolgt von dem Hex-Code verwendet.

Zum Beispiel:

Unicode characters javascript string
// 90 is 5a in hexadecimal system console.log('\u005a'); // Z

Lassen Sie uns die Zeichen mit den Codes 65..220 betrachten und einen String aus ihnen erstellen:

Unicode characters javascript string
let str = ''; for (let i = 65; i <= 220; i++) { str += String.fromCodePoint(i); } console.log(str); // ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~€‚ƒ„ // ¡¢£¤¥¦§¨©ª«¬­®¯°±²³´µ¶·¸¹º»¼½¾¿ÀÁ ÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÚÛÜ

Hier können Sie bemerken, dass Großbuchstaben zuerst kommen, dann einige Sonderzeichen und schließlich ein Ö am Ende der Ausgabe.

Quizzeit: Testen Sie Ihre Fähigkeiten!

Sind Sie bereit, das Gelernte herauszufordern? Tauchen Sie ein in unsere interaktiven Quizze für ein tieferes Verständnis und eine unterhaltsame Art, Ihr Wissen zu festigen.

Finden Sie das nützlich?