Strings und Template-Literale

"5" + 3 ergibt "53", nicht 8. Ist eine Seite von + ein String, verbindet JavaScript Text, statt Zahlen zu addieren.

Text in einem Programm

Namen, Nachrichten, Adressen, Passwörter und ganze Webseiten sind Text, und JavaScript speichert Text als Strings. Ein String ist eine Folge von Zeichen zwischen Anführungszeichen. JavaScript kennt drei Arten von Anführungszeichen: doppelte "so", einfache 'so' und Backticks `so`. Die ersten beiden verhalten sich gleich. Backticks erzeugen ein Template-Literal, das zusätzliche Fähigkeiten hat, die unten erklärt werden.

Enthält dein Text eine Sorte Anführungszeichen, umschließ ihn mit der anderen: "It's late" funktioniert, weil der Apostroph kein doppeltes Anführungszeichen ist. Du kannst auch einen Backslash vor ein Anführungszeichen setzen, um zu sagen „dieses gehört zum Text“: 'It\'s late'. Ein Backslash gefolgt von n, geschrieben \n, bedeutet einen Zeilenumbruch im String.

Länge und Positionen

Jeder String weiß, wie viele Zeichen er hat: "JavaScript".length ist 10. Jedes Zeichen hat außerdem eine Position, den sogenannten Index, und gezählt wird ab 0, nicht ab 1. In "JavaScript" ist also Index 0 das J, Index 4 das S und der letzte Index 9, eins weniger als die Länge. Ein einzelnes Zeichen liest du mit eckigen Klammern: word[0]. Ab 0 zu zählen, fühlt sich anfangs seltsam an, aber die meisten Programmiersprachen zählen so, und bei Arrays begegnet dir das wieder.

const word = "JavaScript";
console.log(word.length);                // 10
console.log(word[0]);                    // J
console.log(word[word.length - 1]);      // t

Nützliche String-Methoden

Strings bringen eingebaute Werkzeuge mit, sogenannte Methoden, die du mit einem Punkt nach dem String aufrufst. toUpperCase() und toLowerCase() geben eine Kopie in Groß- oder Kleinbuchstaben zurück. includes("Script") antwortet true oder false, je nachdem, ob der Text darin vorkommt. slice(0, 4) gibt die Zeichen von Index 0 bis ausschließlich Index 4 zurück, in "JavaScript" also "Java". trim() entfernt Leerzeichen an beiden Enden, praktisch zum Aufräumen von etwas, das jemand eingetippt hat. Keine dieser Methoden ändert den ursprünglichen String. Strings lassen sich in JavaScript nicht an Ort und Stelle ändern, Methoden geben immer einen neuen String zurück.

Strings mit + verbinden

Der Operator + hängt Strings aneinander, das nennt man Verkettung (Konkatenation). "Hello, " + "Mina" ergibt "Hello, Mina". Leerzeichen werden nicht automatisch eingefügt, setz sie also selbst in die Anführungszeichen. Hier ist die Falle vom Anfang: Ist eine Seite von + ein String, macht JavaScript auch die andere Seite zum String und verbindet beide. "5" + 3 ist "53". Die anderen Rechenoperatoren verbinden keinen Text, also wandelt "5" * 2 "5" in eine Zahl um und ergibt 10. Um einen String mit Ziffern in eine echte Zahl umzuwandeln, nimm Number("5").

Template-Literale

Einen Satz mit + zu bauen, wird schnell unübersichtlich: name + " is " + age + " years old." braucht sorgfältig gesetzte Leerzeichen und Anführungszeichen. Ein Template-Literal, geschrieben mit Backticks, lässt dich Werte mit ${ } direkt in den Text setzen. Was in den geschweiften Klammern steht, wird als Ausdruck ausgewertet, und das Ergebnis landet im String. Template-Literale können auch über mehrere Zeilen gehen.

const name = "Mina";
const age = 14;
console.log(`${name} is ${age} years old.`);   // Mina is 14 years old.
console.log(`Next year: ${age + 1}`);           // Next year: 15

Durchgerechnetes Beispiel. Ein Etikett im Laden soll "3 apples cost 4.5" lauten. Mit const n = 3, price = 1.5; erledigt das Template `${n} apples cost ${n * price}` das in einer Zeile, und die Multiplikation passiert in den geschweiften Klammern.