Kategorien
JavaScript Learn to Code

Funktionen

Funktionen sind für Anfänger schwer zu verstehen. An einem kleinen Programm möchte ich ihre Arbeitsweise verdeutlichen. Das Programm stammt aus dem letzten Post:

let name = prompt('Wie heißt Du?');
alert('Hallo ' + name + '!');

Es fragt, wie man heißt und begrüßt einen nach Eingabe seines Namens. Ausprobieren kann man den Code, indem man ihn z.B. im JS Hero Playground eingibt.

Hier haben wir, vielleicht ohne es zu merken, zwei Funktionen, nämlich prompt() und alert(), benutzt. Diese beiden Funktionen werden uns von der JavaScript-Engine des Browsers zur Verfügung bestellt.

Funktionen kann man aber auch selbst schreiben. Das möchte ich an unserem kleinen Programm demonstrieren. Die Arbeitsweise des Programms ändert sich dabei nicht:

function welcome(name) {
  return 'Hallo ' + name + '!';
}

let name = prompt('Wie heißt Du?');
let greeting = welcome(name);
alert(greeting);

Dieses Programm macht genau dasselbe wie das obige Programm: Es fragt, wie man heißt und begrüßt einen. Die entscheidende Änderung ist die Einführung der Funktion welcome(). Wer mit JS Hero gearbeitet hat, erkennt sie vielleicht wieder: Es ist die Lösung der Lektion Strings. Hier sehen wir diese Funktion gewissermaßen in Aktion. Die Funktion selber nimmt einen Namen entgegen und gibt eine entsprechende Begrüßung zurück. Diese Arbeitsweise, ihre Definition, wird in den ersten drei Codezeilen festgelegt. Benutzt wird die Funktion in Zeile 6. Dort macht sie aus dem Namen, unsere Eingabe, die Begrüßung. Diese wird dann in Zeile 7 ausgegeben.

Die Rückgabe der Funktion welcome() muss man nicht in einer Variablen zwischenspeichern. Man kann die Rückgabe auch direkt an alert() weitergeben:

function welcome(name) {
  return 'Hallo ' + name + '!';
}

let name = prompt('Wie heißt Du?');
alert(welcome(name));

Nun stellt sich die Frage, wozu wir die Funktion eingeführt haben. Der ganze Code, so hat man den Eindruck, ist doch nur komplizierter geworden. Dies ist jedoch nur zum Teil richtig. Dort, wo wir die Funktion welcome() benutzen, ist der Code einfacher geworden. Anstatt mit dem Codefragment 'Hallo ' + name + '!' die Begrüßung zusammen zu bauen, brauchen wir nur die Funktionen welcome() aufzurufen. Um die Erzeugung der Begrüßung aus dem Namen brauchen wir uns an dieser Stelle nicht mehr zu kümmern.

Stellen wir uns nun vor, dass wir innerhalb eines Programms besagte Begrüßung an verschiedene Stellen ausgeben möchten. Dann ist es einfacher, die Funktion welcome() zu verwenden, anstatt immer wieder das Codefragment 'Hallo ' + name + '!':

let name = prompt('Wie heißt Du?');
alert('Hallo ' + name + '!');

let nickname = prompt('Wie lautet Dein Nickname?');
alert('Hallo ' + nickname + '!');
function welcome(name) {
  return 'Hallo ' + name + '!';
}

let name = prompt('Wie heißt Du?');
alert(welcome(name));

let nickname = prompt('Wie lautet Dein Nickname?');
alert(welcome(nickname));

Hier spielt die Funktion welcome() ihre Stärke aus: eine wiederkehrende Aufgabe, die Erzeugung einer Begrüßung aus einem Namen, wird einmal definiert und mehrfach benutzt.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.