Wert(e) aus function speichern für andere function vorbehalten und wiederverwenden

[Rolf B]

Hallo Franz,

wenn ich die drei ersten Zeilen, jeweils die Spalten zusammenrechen und ausgebe, mache ich da so

function rechnen_spalte() {
let summe=0;
for (let i=1; i<=8; i++) {
	summe = getInputAsFloat(document.formular1["Wert1"+i])+
			getInputAsFloat(document.formular1["Wert2"+i])+
			getInputAsFloat(document.formular1["Wert3"+i]);
			document.getElementById("Wert10"+i).value= summe;	
			}
}	

Also - die Summenzuweisung sollte eine Zeile tiefer, die muss nicht im Schleifenrumpf stehen. Du musst nicht jedes Zwischenergebnis ins Ergebnis schreiben.

Speichern kann man die Ergebnisse natürlich, aber in einer ereignisgesteuerten Welt bist Du nicht unbedingt sicher, in welcher Reihenfolge die Behandlungsfunktionen ablaufen. Das Verwenden von Zwischenergebnissen setzt aber eine Reihenfolge voraus. Darum lieber neu rechnen.

Damit kommen wir zum Thema Wiederverwendung von Code. Du merkst, dass dein Code dafür noch nicht geeignet ist. Kein Ding, wir sind ja keine Bauingenieure, wir können auch nach Abbinden des Betons noch umbauen. Man nennt das refaktorieren.

Ein Punkt ist das Ermitteln von Werten. Dein Namenskonzept ist an allen möglichen Stellen in Code gebrannt. Das könnte man durch Zugriffsfunktionen einkapseln:

function getEingabefeld(spalte, zeile) {
   return document.formular1["Wert"+zeile+spalte];
}

function getEingabewert(spalte,zeile) {
   return getInputAsFloat(getEingabefeld(spalte, zeile));
}

Der Befehl "return" bewirkt, dass die Funktion einen Wert zurückgibt. Man könnte das Auslagern in getEingabefeld auch lassen, aber ich möchte hier das Konzept der Zuständigkeitstrennung betonen. Eine Funktion sollte genau eine Aufgabe haben. getEingabefeld: Beschaffe das Eingabe-input-Element für eine bestimme Spalte und Zeile. getInputAsFloat: Stelle den Wert des Eingabeelements als float bereit. getEingabewert: Orchestriere die beiden anderen.

An der Stelle ein Hinweis zur Benennung: id="Wert57" ist das Eingabefeld aus Zeile 5, Spalte 7. Du hast ein Ausgabefeld namens Wert103. Das schreit nach Namenskollisionen. Es wäre besser, wenn die ids die Rolle des Feldes widerspiegeln. Ich würde sie "EingabeS5Z7" nennen, und in der getEingabefeld-Funktion auf formular1["EingabeS"+zeile+"Z"+spalte] zugreifen. Dadurch, dass es in einer einzigen Funktion gekapselt ist, musst Du das auch nur an genau einer Stelle programmieren. Die Ausgabefelder sollten dementsprechend "Ausgabe" in der id tragen.

Wir bauen uns gleich noch zwei kleine Helfer: zeilensumme und spaltensumme. Die laufen hier beide bis 8, was eine 8x8 Matrix voraussetzt. Wenn das bei Dir anders ist, musst Du es anpassen.

function getZeilensumme(zeile) {
   let summe = 0;
   for (let spalte=1; spalte <= 8; spalte++) {
      summe += getEingabewert(spalte, zeile);
   }
   return summe;
}

function getSpaltensumme(spalte) {
   let summe = 0;
   for (let zeile=1; zeile<= 8; zeile++) {
      summe += getEingabewert(spalte, zeile);
   }
   return summe;
}

Diese Funktionen sind jetzt viel universeller einsetzbar, weil sie ihr Ergebnis zurückliefern statt es direkt anderswo abzulegen. Das Ablegen machen wir in den Funktionen, mit denen Du angefangen hast:

// Dieser Name ist, meine ich, besser als rechnen_spalte
function rechnen_zeilen123() {
   document.getElementById("Wert10"+i).value = getZeilensumme(1) + 
                                               getZeilensumme(2) + 
                                               getZeilensumme(3);
}

function rechnen(spalte) {
   document.getElementById("Wert"+spalte).value = getSpaltensumme(spalte);	
}

So baut man sich einen wiederverwendbaren Funktionenbaukasten. Je weniger eine Funktion tut, je weniger Abhängigkeiten sie zu anderen Funktionen hat, desto besser kann man sie wiederverwenden.

Rolf