Webdesign mit CSS, HTML und Javascript
Stil mit {stil}
![]() Praxistests aktueller Kameras, Bildbearbeitung und Bildgestaltung foto.5lux.de Online-Magazin für Fotografie und Bildbearbeitung |
Okt 2008
Variablen
Variablen stehen für eine Speicherstelle im Rechner, in der Daten wie Zahlen und Zeichenketten wie »Hallo Welt« gespeichert werden. Variablen haben einen Namen, einen Typ und einen Wert. Die Werte von Variablen können sich ändern, wenn das Programm läuft.
Variablen explizit deklarieren
Das Schlüsselwort »var« vor den Namen legt eine Variable an. Diese Zuweisung wird auch als Deklaration oder Vereinbarung einer Variablen bezeichnet.
var zahl;
Einer Variablen wird entweder gleich bei der Deklaration oder später im Laufe des Programms ein Wert zugewiesen. Bis zur Zuweisung eines Wertes hat die Variable den Wert undefined.
var myVar = 42; // Der Name ist "zahl", der Wert ist 42, der Typ ist numerisch
oder
var myVar; // Wert ist undefined … myVar = 42; // Wert ist 42
In einer Deklaration können auch mehrere Variablen vereinbart werden – sie werden einfach durch Kommas voneinander getrennt.
var name, adresse, hausnr; var name = "Häßler", var adresse = "Erlenstr.", var hausnr = 10;
Allerdings ist die ausführliche Schreibweise vorzuziehen, denn sie lässt sich besser kommentieren und ist zudem besser lesbar:
var name = "Häßler"; // Name var adresse = "Erlenstr."; // Adresse var hausnr = 10; // Hausnummer
Implizite Vereinbarung von Variablen
Variablen können ausdrücklich durch das Schlüsselwort var oder implizit ohne var durch die Zuweisung eines Anfangswerts vereinbart werden. Die einfache Zuweisung definiert eine globale Variable. Globale Variablen sind aber i.d.R. unerwünscht und können die Integrität des Skripts gefährden. Darum ist die ausdrückliche Deklaration mit dem Schlüsselwort var die bessere Technik, während die implizite Vereinbarung einer Variablen als schlechte Programmierpraxis gilt.
var name = "Häßler"; // explizit durch Schlüsselwort var adresse = "Erlenstr." // implizit durch Wertzuweisung
Wird ein Variablenname weder ausdrücklich durch das Schlüsselwort var noch implizit durch die Zuweisung eines Werte deklariert, führt ein Aufruf zu einer Fehlermeldung.
var name = "Häßler";
if (vorname == "Ulrike") {
…
}
Variablen und Datentypen
Die Deklaration einer Variablen in Javascript kann der Variablen einfache Datentypen zuweisen:
- Number (kann sowohl ein ganzzahliger Wert als auch ein Fließkommawert sein)
- String
- Boolean
In Programmiersprachen wie C++ und Java muss der Typ der Variablen deklariert werden. Um eine Variable zum Speichern ganzzahliger Werte zu vereinbaren, muss der Typ explizit deklariert werden:
int num = 5; oder float fnum = 44.5;
Wenn eine Programmiersprache bei der Vereinbarung der Variablen den Datentyp erzwingt, wird sie als »streng typisiert« bezeichnet. Javascript hingegen ist eine dynamische oder locker typisierte Sprache, denn der Typ einer Variablen wird nicht ausdrücklich vereinbart:
var num = 5; var fnum = 44.5;
Javascript verlangt keine Typangabe bei der Deklaration, sondern findet selber heraus, welcher Datentyp in num und fnum gespeichert wird. Wir dürfen einer Variablen zunächst einen String zuweisen und später einen numerischen Wert. Bei der Ausführung des Programms wird der Javascript-Interpreter die Daten in den korrekten Typ konvertieren. In jeder der folgenden Anweisungen wird Javascript den Typ der Variablen konvertieren:
| Anweisung | Konvertierung |
|---|---|
| var item = 5.5; | Zuweisung eines Fließkommawerts |
| item = 44; | Konvertierung in einen Integer |
| item = "Heute scheint die Sonne"; | Konvertierung in einen String |
| item = true; | Konvertierung in einen Boolean |
| item = null; | Konvertierung in einen null-Wert |
Korrekte Variablennamen
Variablennamen bestehen aus Buchstaben (wobei auch ein Unterstrich „_“ als Buchstabe zählt) und aus Ziffern, dürfen keine Leerzeichen enthalten, nicht mit einer Zahl, einem Sonderzeichen oder Satzzeichen anfangen und nicht mit einem Schlüsselwort übereinstimmen. Das erste Zeichen muss ein Buchstabe oder ein Unterstrich sein. Javascript ist zwar eine schwach typisierte Sprache, aber in Hinsicht auf die korrekte Schreibweise kennt Javascript keine Gnade. Variablennamen sind „case sensitive“, d.h., dass Name, name und NAme drei verschiedene Namen sind.
| Korrekte Variablennamen | Nicht korrekte Variablennamen | Was ist falsch? |
|---|---|---|
| name1 | 10names | Variablen müssen mit einem Buchstaben oder einem Unterstrich beginnen |
| price_tag | box.front | Der Punkt im Variablennamen ist nicht zulässig |
| _abc | name#last | Das „#“-Zeichen ist nicht zulässig |
| Abc_22 | A-23 | Das „-“-Zeichen ist nicht zulässig |
| A23 | 5 | Variablennamen müssen mit einem Buchstaben oder einem Unterstrich beginnen |

- Illegale Variablennamen erzeugen eine Fehlermeldung und verhindern die Ausführung des Programms.
Variablen vereinbaren und initialisieren
Variablen müssen deklariert werden, bevor sie benutzt werden. Um sicherzustellen, dass Variablen deklariert sind, kann man sie im Kopf des Skripts vereinbaren. Variablen, die im Kopf des Skripts außerhalb der Funktionen deklariert werden, werden als globale Variablen bezeichnet. Die Deklaration globaler Variablen ist gefährlich, denn weitere Scripte könnten unwissentlich mit einem gleichen Namen globale Variablen überschreiben. Als bessere Technik gilt, Variablen erst dann zu deklarieren, wenn sie gebraucht werden.
Bei der Deklaration kann der Variablen gleich ein Wert zugewiesen werden (die Variable wird initialisiert). Das muss aber nicht so sein – es sei denn, man lässt das Schlüsselwort var weg. Eine Variable, die deklariert, aber nicht initialisiert ist, ist „undefined“.
var variableName = 42; // initialisiert var variableName; // uninitialisiert variableName; // falsch
So könnte eine Variable vorname vom Typ String deklariert werden
var vorname="Maria"; vorname ="Maria"; var vorname;
<script type="text/Javascript">
window.onload = testVariableNames;
function testVariableNames()
{
var example = document.getElementById ('example');
var vorname = "Maria";
var nachname;
alter;
}
</script>
erzeugt einen Fehler:
Der Gültigkeitsbereich einer Variablen
Der Gültigkeitsbereich (scope) oder Namensraum einer Variablen beschreibt, wo eine Variable innerhalb eines Programms verfügbar ist und benutzt werden kann. Javascript-Variablen sind entweder global oder lokal. Auf eine globale Variable kann von jeder Stelle des Programms aus zugegriffen werden – sie gilt im gesamten Programm. Normalerweise ist es erwünscht, dass eine Variable nur in einem bestimmten Bereich eines Programms gültig ist. Das vermeidet Namenskonflikte und das unabsichtliche Ändern von Variablen in anderen Teilen des Programms.
+-------> var myGlobal = 42; // erzeugt eine globale Variable myGlobal | | function func1(arg1, arg2) | { | +-----> var myNum; // erzeugt eine lokale Variable myNum | | myNum = myGlobal + 100; | +-----> … | } | | function func2(arg1, arg2) | { | +-----> var myNum = 200; // erzeugt eine lokale Variable myNum | | myVar = 50; // ohne Schlüsselwort var: | | // erzeugt eine globale Variable myVar | | var myGlobal = 100; // überschreibt die globale Variable myGlobal | +-----> … | } | | function func3(arg1, arg2) | { | | … +-------> }
Wenn eine Variable innerhalb einer Funktion mit dem Schlüsselwort var deklariert wird, ist diese Variable lokal. Auf lokale Variablen kann nur innerhalb der Funktion zugegriffen werden, in der die Varibale vereinbart wird – und zwar von der Stelle der Vereinbarung an bis zum Ende des Blocks. Innerhalb des Blocks überschreibt die Variable alle globalen Variablen mit demselben Namen.
Gute Ratschläge
- Variablen sollten – soweit es möglich ist – lokal gehalten werden und dort vereinbart werden, wo sie auch gebraucht werden. Das hilft bei der Fehlersuche und macht das Skript lesbarer.
- Variablen sind case-sensitiv, also immer darauf achten, dass aName eine andere Variable als AName ist.
-
Variablennamen sollten sich aussprechen lassen und eine sinnvolle Bezeichnung ergeben.
height = 115;
width = 200;
ist besser als
h = 115;
w = 200;
- Variablennamen wie name1 und name2 sind der schnellste Weg zu fehlerhaften Skripten.

