Strings von a bis z
Eingabefelder in Formularen werden in Javascript immer als String gelesen, Pfadnamen und Nachrichten an den Benutzer sind klassische Anwendungen von Strings. Auch wenn wir den Computer »Rechner« nennen: Programme wühlen sich laufend durch Zeichenketten.
Jedes Zeichen eines Strings wird durch ein 16-Bit-Unicodezeichen dargestellt – Strings dürfen Umlaute enthalten und die Interationalisierung von Anwendungen mit Javascript ist ein Klacks.
const simpleStr = "äöüß";
str = "Hallo Welt!"; // Literale Notation *
str = ""; // erzeugt einen leeren String
str = 'D’dorf '; // String in einfachen Hochkommas
str = "Die „Queen Mary 2“ ist eingelaufen";
str = "🍋“; // Ein Emoji ist ein String
str = `width: ${w}`; // Template Literal in Backticks
* Ein Literal ist ein Wert – keine Variable – der dem Script sozusagen wörtlich übergeben wird.
Im dritten Beispiel ist das Apostroph ein typografisches Apostroph-Zeichen ’ (’) und kein einfaches Hochkomma, sonst wäre da ein Fehler vorprogrammiert. Da betrifft Engländer und Franzosen aber eher (don’t, l’amour, I’m leaving).
Queen Mary 2 im vierten Beispiel steht in Anführungszeichen, die vom Script als normale Zeichen interpretiert werden und keine Begrenzung von Strings darstellen. So hingegen provozieren wir einen Fehler:
str = "Die "Queen Mary 2" ist eingelaufen";
Das letzte Beispiel sitzt in Backticks (Accent Grave) und ist die jüngste Variante für die Notation eines Strings.
Hochkommas für Javascript-Strings
Die typografischen Anführungszeichen gelten nicht. Diese gibt es im englischsprachigen Raum nicht – typografische Anführungszeichen finden wir auch nicht auf der Tastatur, sondern setzen sie durch Tastatur-Kombinationen zusammen (Win Alt + 0132 und Alt 8222, Apple Alt Shift W und Alt 2).
Direkt auf der Tastatur gibt es nur das doppelte und das einfache Hochkomma, aber unsere Textverarbeitungsprogramme funktionieren meist vorausschauend und ersetzen das erste doppelte Hochkomma durch ein Anführungszeichen unten und das schließende doppelte Hochkomma durch ein Anführungszeichen oben. Nur diese Automatik bewahrt die deutschen, französischen und schweizer Anführungszeichen vor dem Aussterben.
| „ | „deutsches Anführungszeichen unten“ |
| “ | „deutsches Anführungszeichen oben“ |
| ’ | „Apostroph“ |
Anführungszeichen sehen auch anders aus: Unten wie eine 99, oben wie 66. Hochkommas sind schlichte spartanische Strichlein.
Backticks
Neben einfachen und doppelten Hochkommas gibt es ein weiteres Zeichen, um Strings vom Code zu trennen: Backticks, die rückwärts gerichteten Zeichen wie beim à (accent grave). Sie werden als Template String oder Template Literal bezeichnet und klammern sowohl Strings als auch Variablen ein.
Backticks klammern Strings und Variablen in Javascript ohne +-Zeichen. Die Variable wird mit führendem $ und in geschweiften Klammern geschrieben. Nein, hat nichts mit jQuery zu tun …
const price = 2.19;
console.log (`Zitronen heute nur ${price} €`);
Zitronen heute nur 2.19 €
Backticks sind jünger als einfache und doppelte Hochkommas und werden von alten Browsern wie IE11 nicht erkannt.
Paarweise: einfache und doppelte Hochkommas
Quoting ist die Kunst, Strings in die richtigen einfachen bzw. doppelten Hochkommas zu setzen.
Hochkommas treten immer paarweise auf und die Paare müssen zusammenpassen: Wenn ein String mit einem einfachen Hochkomma beginnt, muss er mit einem einfachen Hochkomma geschlossen werden. Einfache Hochkommas dürfen doppelte Hochkommas enthalten und umgekehrt:
"Dies ist eine Zeichenkette" // schöne doppelte Hochkommas ^ ^ +--------------------------+ '@!zzz@@ zack!!! ' ^ ^ +----------------+ 'p { font-family: "Courier New" }' ^ ^ ^ ^ +--------------------------------+ "Und noch'n 'String'" ^ ^ ^^ +-------------------+ "Wo ist die „Zeichenkette“?" // Anführungszeichen ^ ^ // sind keine Hochkommas +--------------------------+ „Dies ist kein valider String“ // Falsch gequotet: // Anführungszeichen sind keine Hochkommas 'Ohm'scher Widerstand' // Falsch gequotet 'Kein "valider' String" // Falsch gequotet "drunter und drüber" // Verschiedene Strings, da Javascript "Drunter und Drüber" // zwischen Groß- und Kleinschreibung // unterscheidet "5" // Zahlen in Hochkommas: auch nur Strings 5 // Ohne Hochkommas ist die Zahl eine Zahl "" // Leere Hochkommas bilden einen null-String `Zitronen heute ${price} €` // Text-String und Variable in Backticks
Wenn weitere Sätze unterschiedlicher Hochkommas gebraucht werden, können sowohl einfache als auch doppelte Hochkommas mit einem vorangestellten Backslash notiert werden: \" oder \'. Zeichen mit einem vorangehenden Backslash werden als Escape-Sequenzen bezeichnet. Der Backslash teilt dem Interpreter mit, dass er das nächste Zeichen so dargestellen soll wie es ist.
elem.innerHTML = '<?php echo "<p class=\"simple\">Ausgabe"</p> ?>';
^ ^ ^ ^ ^ ^
+-----------+---------+--------+--------+-------+
Länge von Strings: length
str.length gibt die Anzahl der Zeichen eines Strings zurück.
const simpleString = "Ich bin eine Zeichenkette"; let len = simpleString.length; // len hat jetzt den Wert 25
Theoretisch können Strings beliebig lang werden, nur ältere Browser, die heute kaum noch von Belang sind, limitieren Strings auf eine Länge von 255 Zeichen.
Strings suchen, vergleichen und ersetzen
- string match
- durchsucht einen String und gibt alle Treffer als Array zurück.
- string indexOf
- sucht einen String und gibt die erste Fundstelle zurück.
- string search
- sucht ebenfalls einen String und gibt die erste Fundstelle zurück, aber kann mit einem regulären Ausdruck eine komplexe Suche starten.
- string replace
- findet einen String und ersetzt ihn durch eine neue Zeichenkette.
String löschen
Die einfachste Methode, einen String zu löschen, ist das Zuweisen eines leeren Strings.
let simpleString = "Hallo Welt"; … simpleString = "";
Escapezeichen
Escapezeichen werden zur Darstellung von Zeichen benutzt, die in regulären Ausdrücken normalerweise eine besondere Bedeutung haben und zur Darstellung von Zeichen, die nicht auf der Tastatur eingegeben werden können und im Dokument nicht direkt sichtbar sind, sondern nur durch ihre Wirkung in Erscheinung treten.
- \f
- Formfeed (Zeilenvorschub)
- \n
- Newline (Neue Zeile)
- \n
- Newline (Neue Zeile)
- \r
- Carriage return (Wagen-Rücklauf ohne Zeilenvorschub)
- \t
- Tabulator
- \v
- Vertikaler Tabulator
Objekt oder String?
Für Einsteiger ist das String-Objekt kein intuitiver Datentyp und oft fällt es schwer, den Typ einer Variable festzustellen – handelt es sich bei einem Wert um ein Objekt oder um einen String? Hier hilft der typeof-Operator.
let was1 = window.location; // let was2 = window.location.href; // let type1 = typeof(window.location); // let type1 = typeof(window.location.href); //
Sowohl der Aufruf von window.location als auch der Aufruf von window.location.href erzielen dieselbe Ausgaben – aber window.location gibt ein String-Objekt zurück, während window.location.href einen String zurückgibt.
