Javascript Rechnen: Mathe-Operatoren

Mathe, Rechnen und berechnen mit Javascript: Plus, Minus, Division, Modulo

Die mathematischen Operatoren addieren, subtrahieren, teilen und multiplizieren, sie prüfen anhand der Modulo-Funktion, ob Zahlen gerade, ungerade oder durch drei teilbar sind.

Dazu gehört fast immer ein kleiner Test, ob die Werte tatsächlich Zahlen sind.

Ausgerechnet das Pluszeichen ist belastet: Mit dem Pluszeichen werden Zahlen addiert, aber das Plus verbindet auch Strings aneinander (die Konkatenation). Diese Zweifachbelegung wird als Overloading bezeichnet.

Wenn Zahlen z.B. aus Eingabefeldern kommen, muss Javascript vorab dafür sorgen, dass die Werte als Zahlen und nicht als Strings interpretiert werden.

Addition +

'+' – plus – addiert zwei Werte miteinander.

let x = 17;
let y = 23;
let z = x + y;

+

<input type="text" id="add1" size="6" /> + 
<input type="text" id="add2" size="6" /> 
<input type="submit" value="=" />  
<input type="text" id="opRes" disabled="disabled" />
let x = document.getElementById('add1').value;
let y = document.getElementById('add2').value;
let z = document.getElementById('opRes');
x = x.replace(/,/, ".");     // Ersetzt ein Komma in der 
y = y.replace(/,/, ".");     // Zahl durch einen Dezimalpunkt

if (isNaN(parseFloat(x)) || isNaN(parseFloat(y))) {
  z.value = "Fehler: keine Zahl";
} else {
  z.value = parseFloat(x) + parseFloat(y);
}

Benutzereingaben in Formularfeldern liefern in Javascript immer einen String. Um arithmetische Operationen mit Benutzereingaben auszuführen, wandeln parseInt() oder parseFloat() die Werte aus den Eingabefeldern in ganze Zahlen bzw. Fließkommazahlen um.

Die Anweisung let x = document.getElementById('x').value; liest den Wert des ersten Eingabefelds und weist ihn der Variablen x zu, die zweite Anweisung belegt entsprechend die Variable y. Erst wenn durch if (isNaN(parseFloat(x)) || isNaN(parseFloat(y))) sicher gestellt ist, dass x und y tatsächlich Zahlen sind, findet die eigentliche Operation statt: z.value = parseFloat(x) + parseFloat(y); addiert den Wert aus Feld x mit dem Wert aus Feld y und setzt das Ergebnis ist das Feld z.

Subtraktion

Minus '-' subtrahiert den zweiten Wert vom ersten.

let z = x - y;

Multiplikation

Mal '*' multipliziert zwei Werte miteinander.

let z = x * y;

Division

Teilt den ersten Wert durch den zweiten Wert.

let z = x / y;

Javascript Modulo

Der %-Operator teilt den ersten Wert durch den zweiten Wert und gibt den Rest der Division an z zurück.

let z = x % y;

Modulo wird in erster Linie für Tests und Prüfungen eingesetzt – z.B. ob eine Zahl gerade oder ungerade ist.

let z = 42;
if (z % 2 == 0) {
   // gerade Zahl
} else {
   // ungerade Zahl
}

Javascript Inkrement

Der ++-Operator zählt 1 zum Wert hinzu.

let x = 21;
let z = x++; 
// x ist 21 vor der Zuweisung, also wird z auch 21, aber x wird 22
let z = ++x;
// x wird 22 vor der Zuweisung, also wird z 23 und x wird ebenfalls 22 

Solche Stepper findet man in der for-Anweisung und mit dem doppelten Plus zählt das Script, wie oft eine while-Schleife durchlaufen wurde.

Javascript Dekrement

Zieht 1 vom Wert ab

let x = 100;
let z = x--;
// x ist 100 vor der Zuweisung, also wird z 100, aber x wird 99
let z = --x;
// x wird 99 vor der Zuweisung, also wird z 99 und x wird ebenfalls 99

Javascript Negation

Dreht das Vorzeichen des Werts um – aus Plus wird Minus und aus Minus wird Plus.

let z = x-;

Komplizierte Berechnungen

Die klassischen Operationen der Mathematik finden sich im Javascript Math Objekt: Sinus, Cosinus, Tangens, Logarithmus, Exponentialfunktionen und nicht zuletzt das Erzeugen von Zufallszahlen.

Nicht alle Berechnungen sind so einfach, wie es auf den ersten Blick erscheint. Das Berechnen der Zeit zwischen zwei Tagen ist aufwändig, denn Javascript Date Objekte können nicht einfach addiert oder voneinander subtrahiert werden.

// Zeitangaben: 'y', 'm', 'w', 'd', 'h', 'n', 's'
Date.dateDiff = function(datepart, fromdate, todate) {	
	datepart = datepart.toLowerCase();	
	let diff = todate - fromdate;	
	let divideBy = { y:31536000000,
                     w:604800000, 
                     d:86400000, 
                     h:3600000, 
                     n:60000, 
                     s:1000 };	
  return Math.floor( diff/divideBy[datepart]);
}
//  Zwei Termine vorgeben
let y2k  = new Date(2000, 0, 1);
let today= new Date();
document.querySelector(".dateDiff").innerHTML = (Date.dateDiff('d', y2k, today)) + " Tage seit Beginn des Milleniums";

Gefunden bei HTML Goodies

+ + = / %