7.3.1 Variablen

Wie in anderen Programmiersprachen gibt es auch in JavaScript verschiedene Arten von Variablen.

Boolesche Variablen

Wenn wir einer Variable lediglich den Wert „richtig“ oder „falsch“ zuweisen wollen, sollten wir booleschen Variablen verwenden. Diesen können Sie den Wert true (Aussage stimmt) oder false (Aussage stimmt nicht) zuweisen. Boolesche Variablen werden, wie in anderen Programmiersprachen auch, bei Schleifen und bedingten Anweisungen verwendet.

1
2
const testObRichtig = true;
const testObFalsch = false;

Numerische Variablen

Numerische Variablen sind Variablen, denen Zahlenwerte zugewiesen werden. Dezimalzahlen werden dabei mit einem Punkt angegeben, statt mit einem Komma. Auch negative Zahlen sind erlaubt.

Beispiel mit const

1
2
3
const negativ = -5;
const anfangsbestand = 1000; // Startkapital in Euro
const zinsrate = 0.05;       // 5% jährliche Zinsen

Beispiel mit let

let sollte verwendet werden, wenn der Wert einer Variablen sich ändern kann, z. B. bei einer jährlichen Zinsberechnung.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
let jahre = 0;
let aktuellerBestand = anfangsbestand;

// Jährliche Zinsberechnung über 3 Jahre
jahre = 1;
aktuellerBestand = aktuellerBestand * (1 + zinsrate);
console.log(`Jahr ${jahre}: ${aktuellerBestand} Euro`); // Ausgabe auf der Console

jahre = 2;
aktuellerBestand = aktuellerBestand * (1 + zinsrate);
console.log(`Jahr ${jahre}: ${aktuellerBestand} Euro`);

jahre = 3;
aktuellerBestand = aktuellerBestand * (1 + zinsrate);
console.log(`Jahr ${jahre}: ${aktuellerBestand} Euro`);

Hinweis

  • Verwenden Sie const für Werte, die sich im Programm nicht ändern, wie die Startwerte anfangsbestand oder zinsrate.
  • Verwenden Sie let für Variablen, die während der Ausführung des Codes einen neuen Wert erhalten, wie jahre und aktuellerBestand.

Zeichenketten (Strings)

Zeichenketten werden in Programmiersprachen auch oft Strings genannt. Strings werden von Anführungszeichen eingeschlossen. Dabei ist es egal, ob einfache (') oder doppelte (") Anführungszeichen verwendet werden.

Beispiel mit const

const sollte verwendet werden, wenn der Wert der Zeichenkette unveränderlich ist:

1
const buchTitel = "Die Leiden des jungen Werther";

Beispiel mit let

let sollte verwendet werden, wenn der Wert der Zeichenkette im Verlauf des Programms geändert werden kann:

1
2
3
4
5
let aktuellerStatus = "Buch wird gelesen";
console.log(aktuellerStatus); // Ausgabe: Buch wird gelesen

aktuellerStatus = "Buch wurde fertig gelesen";
console.log(aktuellerStatus); // Ausgabe: Buch wurde fertig gelesen

Hinweis

  • Verwenden Sie const für Zeichenketten, die sich nie ändern.
  • Verwenden Sie let, wenn die Zeichenkette im Laufe des Codes aktualisiert oder überschrieben wird.

Primitive Datentypen

In JavaScript gibt es folgende primitive Datentypen zum Speichern einfacher Werte, von denen für uns hier die Typen number, string und boolean wichtig sind.

Typ Beschreibung Beispiel
number Für alle numerischen Werte, einschließlich Ganzzahlen und Gleitkommazahlen (kein int oder float separat). 42, 3.14, -7
string Für Text oder Zeichenfolgen. Zeichenketten werden in Anführungszeichen gesetzt. "Hallo", 'Welt'
boolean Für Wahrheitswerte true oder false. true, false
bigint Für sehr große Ganzzahlen, die Number übersteigen (ab ECMAScript 2020). 12345678901234567890n, BigInt(42)
null Ein spezieller Wert, der die Abwesenheit eines Wertes repräsentiert. null
undefined Zeigt an, dass eine Variable deklariert, aber nicht initialisiert wurde. let x; console.log(x); // undefined
symbol Ein einzigartiger und unveränderbarer Wert, oft für Objektschlüssel verwendet (ab ECMAScript 2015). Symbol("id"), Symbol()

Infinity und NaN gehören zum Typ number.

  • Infinity: Eine Zahl, die größer als jede andere ist.
  • NaN (Not-a-Number): Ein spezieller Wert, der anzeigt, dass eine mathematische Operation fehlgeschlagen ist.
  • Beispiel:
console.log(1 / 0);      // Infinity
console.log("abc" * 2);  // NaN

Besondere Fälle: Anführungszeichen und Escape-Zeichen

Wenn Sie ein Zitat in eine String-Variable stellen möchten, gibt es das Problem mit den Anführungszeichen. Um dies zu lösen:

  1. Verwenden Sie das einfache Anführungszeichen für den String, wenn doppelte Anführungszeichen im Zitat enthalten sind.
  2. Alternativ können Sie das doppelte Anführungszeichen maskieren, indem Sie einen Backslash (\) davor setzen.

Beispiel: Maskieren von Anführungszeichen

1
const zitat = "\"Wer reitet so spät durch Nacht und Wind\"";

Durch das Maskieren weiß der JavaScript-Interpreter, dass das Anführungszeichen Teil des Variablenwertes ist.

Weitere Escape-Sequenzen

JavaScript bietet zusätzliche Sonderzeichen, die Sie in Strings verwenden können:

Zeichen Bedeutung
\n Neue Zeile
\t Tabulator
\f Seitenvorschub 
1
const sonderzeichen = "Zeile1\nZeile2\tTabulator\fSeitenvorschub";

Unterschied zwischen var, let, und const

In JavaScript-Programmen sollten wir die Schlüsselwörter let und const bevorzugt verwenden. Der Unterschied liegt im Gültigkeitsbereich (Scope):

  • var: Besitzt Funktions-Scope. Variablen, die mit var in einer Schleife deklariert werden, sind außerhalb der Schleife weiterhin sichtbar.
  • let: Besitzt Block-Scope. Variablen, die mit let deklariert werden, sind nur innerhalb des umschließenden Blocks sichtbar.
  • const: Besitzt ebenfalls Block-Scope, erlaubt aber keine Neuzuweisung des Werts.

Beispiel: Unterschied zwischen var und let

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
"use strict";
for (var i = 1; i <= 3; i++) {
  console.log(`Innerhalb der Schleife: ${i}`);
}
console.log(`Außerhalb der Schleife: ${i}`); // `i` ist hier noch sichtbar (Funktions-Scope)

for (let j = 1; j <= 3; j++) {
  console.log(`Innerhalb der Schleife: ${j}`);
}
console.log(`Außerhalb der Schleife: ${j}`); // Fehler: `j` ist nicht definiert (Block-Scope)

Beispiel: Fehler mit const in einer Schleife

Variablen, die in einer Schleife inkrementiert werden, dürfen nicht mit const deklariert werden, da const keine Neuzuweisung erlaubt.

1
2
3
4
"use strict";
for (const i = 1; i <= 3; i++) {
  console.log(i); // Fehler: i kann nicht inkrementiert werden
}

Hinweise zur Verwendung

  • Verwenden Sie const für Variablen, deren Wert sich nicht ändern soll.
  • Nutzen Sie let, wenn eine Variable während der Programmausführung einen neuen Wert erhalten soll.
  • Vermeiden Sie die Verwendung von var, da es zu unerwarteten Fehlern führen kann.

Ausgaben mit console.log und document.write

In dieser und den folgenden Seiten verwenden wir console.log() und document.write() zur Ausgabe.

console.log

Primär für Debugging: Mit console.log() können Sie Informationen in der Entwicklerkonsole des Browsers ausgeben.

Nicht sichtbar im Browser: Die Ausgabe erfolgt nur für Entwickler, nicht im sichtbaren Bereich der Webseite.

console.log("Dieser Sourcecoode wird ausgeführt");

document.write

Direkte Ausgabe in die Webseite: Mit document.write können Inhalte direkt in das HTML-Dokument geschrieben werden.

1
document.write("Diese Ausgabe erscheint auf dem Browser>");

Für die Darstellung von Inhalten auf der Webseite kann man document.write() nutzen, um "mal eben etwas für einen Test auszugeben". In der ernsthaften JavaScript-Programmierung gibt es jedoch sicherere und flexiblere Methoden zur Ausgabe von Inhalten auf dem Browser. Die gängigsten Alternativen basieren auf DOM-Manipulationen mit JavaScript (z. B. innerHTML oder appendChild) anstelle von document.write. Dies sorgt für bessere Wartbarkeit und vermeidet grafische Probleme.