Javascript Tutor - Lektion 23
Mehrere Funktionen
Manchmal brauchst Du mehr als eine Funktion, um mächtige Scripte zu schreiben. Eine Funktion wird aufgerufen und diese verwendet weitere Funktionen.
Hier ist ein Beispiel...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function SagHallo()
{
GetName();
alert("Hallo " + myname);
}
function GetName()
{
myname = prompt("Wie ist Dein Name?", "");
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:SagHallo()">Klicke hier</A>
</BODY>
</HTML>
|
Verstehst Du, was hier passiert? Der Link ruft die Funktion SagHallo() auf, die wiederum die Funktion GetName() aufruft. Nach Ausführung von GetName() wird die Steuerung wieder an die Funktion SagHallo() zurück gegeben und die Alarm Box geht auf.
Nun, hier ist eine wichtige Regel, die Du kennen solltest... eine Variable, die in einer Funktion festgelegt wird , ist nur in dieser Funktion verfügbar. Eine Variable, die außerhalb einer Funktion festgelegt wurde, ist überall verfügbar.
Aber, wenn Du Dir die Funktion GetName() ansiehst, Siehst Du, dass darin die Variable myname festgelegt wurde, aber sie wird immer noch in der Funktion SagHallo() verwendet beim Alert Kommando. Wie geht das? Nun, wir haben genauer weise myname nicht "deklariert" ... wird nutzten sie nur. um irgendwo eine Variable festzulegen, musst Du "var" voran stellen. Um den Unterschie dzu sehen, ändere das obige Beispiel und lege eine Variable myname in der Funktion GetName() fest...
var myname = prompt("Wie ist Dein Name?", "");
Das funktioniert nicht richtig, stimmt's? Also warum hat es vorher funktioniert? Weil das Script ohne besondere Festlegung einer Variablen mit "var" annimmt, es handelt sich um eine globale Variable (eine globale Variable ist überall verfügbar).
Also, warum ist das wichtig? Warum machen wir nicht ALLE Variablen zu globalen? Nun, bei größeren Scripts musst Du bei der Namensvergabe für Variablen sehr vorsichtig sein. Du KANNST alle Variablen global machen. Wir taten dies bisher andauernd. Wir haben jetzt die Wahl. Wir könnten eine Variable "name" in zehn verschiedenen Funktionen nutzen, ohne das Script zu verwirren oder sie versehentlich immer wieder überschreiben (ihren Wert ändern).
All das Gerede über mehrere Funktionen und globale gegen lokale Variablen führt zu einem sehr wichtigen Konzept... Wiederverwendbarkeit. Eine wieder verwendbare Funktion ist eine Funktion, die eine spezifische Aufgabe ausführt und kann in verschiedene Anwendungen übernommen werden. Du schreibst eine kleines Script, das etwas bestimmtes tut und wann immer Du diese bestimmte Aufgaben erledigen musst, fügst Du diese Script mit ein und verwendest sie als kleines Werkzeug.
Hier ist ein kleines Script, das ich immer wieder verwende. Es ist ein ZufallszahlenGenerator...
// ZufallszahlenGenerator. Wenn max=3 dann gibt die Funktion zurück: 1,2 oder 3
function getRandom(max) {return (Math.floor(Math.random()*max))+1;}
(Es ist auf eine Zeile begrenzt für leichtere Handhabung.)
Wann immer ich eine Zufallszahl zwischen 1 und irgendwas brauche, rufe ich einfach nur die Funktion getRandom(irgendwas) auf. (Ich muss nicht erwähnen, dass ich diesen Aufruf im Script platziere, meistens am Anfang.) Wenn ich eine Zufallszahl zwischen 1 und 100 haben möchte, rufe ich die Funktion so auf: getRandom(100).
Erinnerst Du Dich, vor einer Weile haben wir über Popup-Boxen gesprochen, die einen Wert zurück liefern? Nun, ich habe eine bestimmte Funktion, die genau das tut. Bemerkst Du die "Return" Anweisung? Diese Funktion wurde geschrieben, um eine Zufallszahl zurück zu liefern. Sie erzeugt nicht nur eine Zufallszahl, sie sendet diese auch zurück von wo immer die Funktion aufgerufen wurde.
Stell Dir mal Folgendes vor...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
// ZufallszahlenGenerator. Wenn max=3 dann gibt die Funktion 1,2 oder 3 zurück
function getRandom(max) {return (Math.floor(Math.random()*max))+1;}
function GetNumber()
{
mynumber = getRandom(10);
alert(mynumber);
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:GetNumber()">Klicke hier</A>
</BODY>
</HTML>
|
mynumber ist gleich dem, was die Funktion zurück gibt. Die Funktion gibt eine Zufallszahl zurück zwischen 1 und 10, also ist mynumber gleich einer Zufallszahl zwischen 1 und 10.
Du solltest das verstanden haben, bevor Du weitermachst..
| << Zurück Weiter >> |
 |
|
 |
