molily: Eingabe von Variablen, verarbeitun durch funktion und ausgabe

Beitrag lesen

Hallo,

allgemein solltest du dein Programm in drei Stufen aufbauen:

1. Eingabe
2. Verarbeitung
3. Ausgabe

Eingabe und Ausgabe erfolgen über Formularfelder. Eingabe: Du liest den Wert aus den Feldern in eine JavaScript-Variable ein. Verarbeitung: Aus den Eingabe-Werten wird ein Ergebnis berechnet. Ausgabe: Du schreibst das Ergebnis wieder in ein Formularfeld.

Beispiel Eingabe (lese die Eingaben in Variablen ein):

var M = document.BruttoForm.M.value;  
var L = document.BruttoForm.L.value;  
var T = document.BruttoForm.T.value;

Beispiel Verarbeitung (dein Code):
var Ergebnis = 66.5 + 13.7* M + 5 * L - 6.8 * T;

Beispiel Ausgabe:
document.BruttoForm.Ergebnis.value = Ergebnis;

Nun zu Funktionen. Funktionen in JavaScript kannst du dir wie mathematische Funktionen vorstellen. In der Mathematik notiert man bspw. f(x), sprich: f von x. x ist hier der Eingabewert, in Programmiersprachen Funktionsparameter genannt. Mithilfe dessen berechnet die Funktion ein Ergebnis, in Programmiersprachen Rückgabewert genannt. Einfaches Beispiel:

function quadrat (x) {  
  return x * x;  
}  
alert( quadrat(2) );

Diese Funktion erwartet einen Parameter, der wird innerhalb der Funktion mit dem Variablennamen x angesprochen. Die Funktion berechnet damit einen neuen Wert (nämlich x * x) und gibt diesen Wert als Ergebnis zurück. Dieser wird dann mit alert() ausgegeben. Wir könnten natürlich auch anderes mit dem Ergebnis anstellen.

Das zwischen den runden Klammern nennt sich Liste der formalen Parameter. Wenn die Funktion nur einen Parameter erwartet, steht da nur ein Variablenname, ansonsten kannst du da mehrere auflisten im Falle von Berechnungen, die mit mehreren Variablen arbeiten:

function Grundumsatz (M, L, T) {  
  return 66.5 + 13.7 * M + 5 * L - 6.8 * T;  
}  
alert( Grundumsatz(75, 180, 30) );

Hier werden drei Werte übergeben und dementsprechend stehen drei Namen in der Parameterliste - die Funktion nimmt also drei Parameter entgegen. (Strenggenommen kann man einer Funktion in JavaScript auch mehr oder weniger Parameter übergeben, als deklariert sind, aber das ist hier nicht von Belang.)

Eigentlich musst du dir nicht die Mühe machen, und so stark mit Parametern und Rückgabewerten arbeiten. Eine Funktion muss weder das eine noch das andere haben. Ich würde einfach eine Funktion schreiben, die Eingabe, Verarbeitung und Ausgabe kombiniert:

function berechneGrundumsatz () {  
   // Eingabe  
   var M = document.BruttoForm.M.value;  
   var L = document.BruttoForm.L.value;  
   var T = document.BruttoForm.T.value;  
  
   // Verarbeitung  
   var Ergebnis = 66.5 + 13.7* M + 5 * L - 6.8 * T;  
  
   // Ausgabe  
   document.BruttoForm.Ergebnis.value = Ergebnis;  
}

Und diese dann beim Klick auf den Button (ohne Parameter) aufrufen:

<input type="button" onclick="berechneGrundumsatz()">

Das Einlesen steht in deinem Code im onclick-Attribut und die Werte werden übergeben - das geht natürlich auch, aber das finde ich nicht übersichtlicher.

Den Verarbeitungsteil könntest du in eine zweite Funktion auslagern, die wie die obige aussieht: function Grundumsatz (M, L, T) { return ...; }. Dann sähe der mittlere Teil so aus:

var Ergebnis = Grundumsatz(M, L, T);

Das illustriert natürlich besser Funktionen mit Parametern und Rückgabewerten. Die umgebende Funktion »berechneGrundumsatz« hat in dem Fall weder Parameter noch Rückgabwerte, nur die Funktion, in die die Formel ausgelagert wurde.

Mathias