Home
Navigation
Impressum
Coder Welten - Programmierung und Optimierung
Coder Welten
 
 

 

 

Lokale und globale Variablen in JavaScript

Eine kleine Einführung in die Syntax - Teil II

Übersicht / Seite:

  1. Syntax von JavaScript (eine kleine Einführung in die Schreibweise)
  2. Variablen (lokale und globale Variablen deklarieren und definieren)
  3. Datentypen (Ermittlung und Umwandlung von Datentypen)
  4. Operatoren (Ausdrücke, Operanden und spezielle Operatoren)

Variablen deklarieren und definieren

Es gibt in JavaScript einige kleinere Code-Schnipsel, die kommen noch ohne die Verwendung von Variablen aus. Zum Beispiel wenn es nur darum geht einen kleinen Framebrecher in eine Seite einzubinden oder mit Hilfe eines Event-Handlers ein zusätzliches Fenster zu öffnen. Immer dann, wenn Werte zur weiteren Verarbeitung übergeben werden müssen, geht es hingegen nicht mehr ohne die Verwendung von Variablen ab. Doch was ist eigentlich eine Variable?

Eine Variable enthält im Allgemeinen einen Wert, welcher mit einfachen Gleichheitszeichen (Zuweisungsoperator) der Variablen zugewiesen wird. Dieser Wert wird unter der Adresse der Variablen im Speicherbereich des Systems abgelegt. Bei JavaScript werden die Adressen nur temporär für die Lebensdauer eines Funktionsaufrufes oder für die einmalige Benutzung eines Scripts im Speicherbereich des Browsers angelegt, wobei noch zwischen globalen und lokalen Variablen zu unterscheiden ist.
Um Verwechslungen vorzubeugen, was von Programmierern allgemein als Variable bezeichnet wird, ist eigentlich nur der gewählte Bezeichner für eine Speicheradresse, unter welcher der Wert abgelegt wurde und unter der dieser Wert erreichbar ist. Eine Variable muss deklariert (und sollte definiert) werden, bevor mit dieser gearbeitet werden kann. Es ist zwar möglich, Variablen vor der Verwendung nur zu deklarieren, doch sind diese dann vom Typ her noch undefiniert. Damit eine Variable als definierte Variable im Script verwendet werden kann, muss der Variablen ein Anfangswert zugewiesen werden.
Bei den Anfangswerten kann es sich um numerische Werte, um Strings, um die Boolean-Werte true oder false, um null, aber auch um Methoden, um Funktionen oder um Objekte handeln. Bei einer Zuweisung von null würde eine Variable nicht mehr als undefiniert gelten, enthielte aber keinen "verwertbaren" Wert, da null halt null wie leer ist. Doch Vorsicht, null ist nicht gleich Null, da JavaScript zwischen Groß- und Kleinschreibung unterscheidet und null in Kleinschreibung zu den reservierten Schlüsselwörtern gehört.

<!DOCTYPE html>
<html>

<head>
<title>Die Null in JavaScript</title>
<meta charset="windows-1252">
</head>

<body>
<h1>Beispiel 5</h1>
<script type="text/javascript">

var look;

function ratlos() {
    var nichts = null;

    if (nichts === null) {
        look  = "Die Variable 'nichts' ist vom Typ ein " + typeof(null);
        look += " und enthält den Wert " + nichts + ".<br><br>";
        look += "Eine große Null ist vom Typ " + typeof(Null);
        look += ", wie eine undefinierte Variable, ";
        look += "aber eine kleine null ist vom Typ ein " + typeof(null) + "!";
    }
    else {
        look = "Ist sie nicht!";
    }
}
ratlos();
document.write(look);

</script>
</body>
</html>

» Beispiel 5 «

In dem folgenden Beispiel wird die Funktion getAktuell() in der Variablen "abruf", das Objekt Date in der Variablen "heute" und die Methode getElementById in der Variablen "schreibe" gespeichert. Beim Aufruf der in der Variablen "abruf" gespeicherten Funktion getAktuell wird der Inhalt des Objektes ins Dokument geschrieben.

<!DOCTYPE html>
<html>

<head>
<title>Datum und Zeit</title>
<meta charset="windows-1252">
</head>

<body>
<h1>Beispiel 6</h1>
<p>Ein Beispiel zur Ausgabe von Datum und Zeit.</p>
<script type="text/javascript">

var abruf = function getAktuell() { 
    var heute = new Date();

    var schreibe = document.getElementById("ausgabe");
    schreibe.innerHTML = (typeof(heute) + " - " + heute);
}
</script>

<p id="ausgabe"> </p>
<p><a href="javascript:abruf()">Heute</a></p>

<!-- Ausgabe: object - Sat Oct 6 15:12:58 UTC+0200 2012 -->
</body>
</html>

» Beispiel 6 «

Ein Definieren einer Variablen durch Wertezuweisung wird auch als Initialisierung bezeichnet, da der Variablen ein Anfangswert zugewiesen wird, mit dem diese initialisiert wird und so gelten mit einem Wert belegte Variablen automatisch als definiert. Definierte Variablen werden jedoch nicht automatisch durch eine Initialisierung deklariert, der JavaScript-Interpreter behandelt diese im normalen Modus nur wie global deklarierte Variablen, davon ausgehend, dass es sich um eine indirekt deklarierte Variable handelt. Im Strict Mode würde hingegen ein Fehler ausgelöst.
Der Strict Mode kann zur Überprüfung eines Scripts verwendet werden und soll einer gewissen Schludrigkeit beim Programmieren entgegenwirken. So löst der Zugriff auf eine nicht deklarierte Variable einen Fehler aus, zumindest in den neueren Versionen vom Firefox und Chrome.

Bei der Wertezuweisung muss ein String immer in Anführungszeichen gesetzt werden, alle anderen Werte hingegen nicht. Kommen innerhalb des Strings weitere Anführungszeichen vor, so müssen diese mit einem rückwärts gerichteten Schrägstrich maskiert werden.

Beispiel für die Deklaration und Definition von Variablen:

<!DOCTYPE html>
<html>

<head>
<title>Wertezuweisung und Initialisierung</title>
<meta charset="windows-1252">
</head>

<body>
<h1>Beispiel 7</h1>
<p>Überprüfung von Variablen mit typeof:</p>
<script type="text/javascript">

// Deklaration der Variablen abc1, abc2, abc3
var abc1, abc2, abc3;

/*
   Deklaration und Definition durch Wertezuweisung/Initialisierung 
   der Variablen bv und cv. Die Variable bv wurde mit dem Zahlenwert 66
   initialisiert und als Variable vom Typ Number definiert. Die Variable 
   cv wurde mit dem String "Ein String" initialisiert und als Variable 
   vom Typ String definiert.
*/
var bv = 66;
var cv = "Ein String";
var str;

// Test für Ausgabe
str  = typeof(abc2) + "<br>";
str += typeof(bv)   + "<br>";
str += typeof(cv)   + "<br>";

document.write(str);

/* Ausgabe:

   undefined
   number
   string
*/

</script>
</body>
</html>

» Beispiel 7 «

Im Beispiel werden die Variablen abc1 bis abc3 nur deklariert. Durch diese Deklaration werden die Variablen im System nur bekannt gemacht und es wird Speicherplatz für diese Variablen reserviert. Da den Variablen jedoch noch keine Werte zugewiesen wurden, sind diese noch nicht definiert. Anders verhält es sich mit den Variablen bv und cv. Diese wurden deklariert, definiert und initialisiert.
Eigentlich könnte auf eine einfache Deklaration in JavaScript verzichtet werden, wäre da nicht dieser Strict Mode. Es gibt jedoch Programmiersprachen, bei denen die Deklaration mehr von Bedeutung ist, wie zum Beispiel bei der Deklaration von Variablen in C und eine Verbesserung des eigenen Programmierstils hat noch niemanden geschadet.

Für die Bezeichner von Variablen dürfen alle Buchstaben des Alphabets, alle Ziffern, der Unterstrich und das Dollarzeichen verwendet werden, nur beginnen dürfen die Bezeichner nicht mit einer Ziffer. Umlaute schlüpfen mit durch, auch wenn ein Bezeichner mit einem Umlaut beginnt, dennoch sollte möglichst auf Umlaute verzichtet werden. Für JavaScript reservierte Wörter, wie new, this, else oder false, um nur einige wenige zu nennen, dürfen nicht als Bezeichner verwendet werden. Groß- und Kleinschreibung muss bei der Benennung beachtet werden.

Gültigkeitsbereich von Variablen

In einem JavaScript ist es nicht unbedingt erforderlich, eine Variable mit var zu deklarieren, da Variablen auch durch eine einfache Wertezuweisung initialisiert werden können und der Interpreter den gewählten Bezeichner dadurch als Bezeichner für eine Variable behandelt. Doch nur weil nicht unbedingt erforderlich, sollte dennoch nicht auf eine richtige Deklaration verzichtet werden und eine Deklaration mit var innerhalb einer Funktion entscheidet über den Gültigkeitsbereich einer Variablen.
Außerhalb von Funktionen definierte Variablen sind als globale Variablen zu betrachten, da diese im ganzen Script-Bereich gültig sind, egal ob die Variablen mit var deklariert wurden oder nicht. Innerhalb von Funktionen angelegte Variablen sind aber nur dann global, wenn diese nicht mit var deklariert wurden.

Beispiel: Gültigkeitsbereich von lokalen und globalen Variablen

<!DOCTYPE html>
<html>

<head>
<title>Gültigkeitsbereich in JavaScript</title>
<meta charset="windows-1252">
</head>

<body>
<h1>Beispiel 8</h1>
<p>Überprüfung des Gültigkeitsbereichs:</p>
<script type="text/javascript">

var abc1, abc2;

abc1 = 11;  // global
abc2 = 22;  // global
abc3 = 33;  // global, aber Fehler im Strict Mode
abc4 = 10;  // global, aber Fehler im Strict Mode

function abFrage() {
    var abc3, abc4, abc5;

    abc1 = 44 + abc1;  // global | 44 + 11 = 55
    abc2 = 55 + abc2;  // global | 55 + 22 = 77
    abc3 = 66 + abc3;  // lokal  | 66 + 33 = 99
    abc4 = 77 + abc4;  // lokal  | 77 + 10 = 87
    abc5 = 88;         // lokal  | 88
    abc6 = 88 + abc5;  // global | 88 + 88 = 176, aber Fehler im Strict Mode
}

abFrage();  // Aufruf der Funktion

var str;

str  = typeof(abc1) + " - " + abc1 + "<br>";
str += typeof(abc2) + " - " + abc2 + "<br>";
str += typeof(abc3) + " - " + abc3 + "<br>";
str += typeof(abc4) + " - " + abc4 + "<br>";
str += typeof(abc5) + " - <br>";
str += typeof(abc6) + " - " + abc6 + "<br>";

document.write(str);

/* Ausgabe:

   number - 55
   number - 77
   number - 33
   number - 10
   undefined -
   number - 176
*/

</script>
</body>
</html>

» Beispiel 8 «

Wie aus dem Beispiel ersichtlich wird, lassen sich nur die innerhalb der Funktion verrechneten Werte der Variablen abc1 und abc2 ausgeben. Die Werte, die außerhalb der Funktion den globalen Variablen abc3 und abc4 zugewiesen wurden, lassen sich hingegen zwar mit den Werten der Variablen abc3 und abc4 innerhalb der Funktion verrechnen, doch da sich deren Gültigkeitsbereich auf den Bereich der Funktion beschränkt, nur über einem Umweg außerhalb der Funktion nutzen. Auf die lokale Variable abc5 kann zwar nicht außerhalb der Funktion zugegriffen werden, jedoch auf das Ergebnis der Addition der Variablen abc5 plus abc6.

In den Kommentaren vom 8. Beispiel wurde auf kleinere Fehler hingewiesen, die sich im Strict Mode zu erkennen geben würden. Nachfolgend der korrigierte Code-Abschnitt:

<script type="text/javascript">

var abc1 = 11;  // global
var abc2 = 22;  // global
var abc3 = 33;  // global
var abc4 = 10;  // global
var abc6;
...

</script>

Die Verwendung von lokalen Variablen innerhalb eines Scripts, deren Gültigkeitsbereich sich auf Funktionen beschränkt, besitzt gegenüber der Verwendung von übermäßig vielen globalen Variablen einen Vorteil. Dieser Vorteil besteht darin, dass lokale Variablen nicht mit gleichnamigen Variablen außerhalb von Funktionen oder mit globalen Variablen aus anderen Scripts, die in ein und demselben Dokument eingebunden wurden, in Konflikt geraten können.

Syntax von JavaScript « zurück / weiter » Datentypen

 
Navigation

Einstieg in JavaScript

 


Listings & Tutorials

 

Weitere Themen

Übersicht

 


Copyright © Verlag Horst Müller - Stendal - 2006 - Impressum - Datenschutz - Nutzungsbedingungen