JavaScripts › Mathematik

Zufallszahl

Zieht auf Knopfdruck eine Zufallszahl zwischen Null und einer selbst gewählten Obergrenze.

Dieses Script erzeugt eine Zufallszahl zwischen Null und einer Obergrenze, die ihr selbst bestimmt. Praktisch ist das überall dort, wo etwas ausgelost werden soll: eine Gewinnnummer, ein Losentscheid unter Freunden, eine zufällige Seitenzahl zum Aufschlagen oder ein Startwert für ein Spiel.

Die Bedienung ist denkbar einfach: Tragt ins Feld die gewünschte Obergrenze ein — vorbelegt sind 1200 — und klickt auf „Berechnen". Die gezogene Zahl erscheint sofort darunter. Jeder weitere Klick zieht eine neue Zahl, ihr könnt also beliebig oft hintereinander losen.

Ein Wort zum Zufall im Rechner: Echten Zufall kennt ein Computer nicht. Was hier gezogen wird, sind sogenannte Pseudozufallszahlen — eine Zahlenfolge, die aus einem Startwert berechnet wird und statistisch wie Zufall aussieht. Für Spiele, Verlosungen und Spielereien reicht das vollkommen; für Sicherheitsanwendungen wie Passwörter oder Schlüssel nimmt man dagegen besondere, kryptografisch geeignete Verfahren.

Braucht ihr mehrere Zahlen auf einmal, schaut euch die Zufallszahlen berechnen und die 5 Zahlen an; wer statt einer freien Obergrenze lieber Augenzahlen von 1 bis 6 möchte, wird beim Würfel fündig.

Mathematik Baujahr 2004 läuft in deinem Browser

Jeder Klick zieht eine neue Zahl.

So funktioniert das Script

Das Script ist eines der kürzesten in unserem Archiv: Es liest die Obergrenze aus dem Eingabefeld, würfelt daraus eine Zahl und schreibt sie in die Ausgabefläche. Trotzdem stecken darin gleich mehrere Dinge, die man beim Programmieren immer wieder braucht.

const grenze = Number(document.getElementById("zz-grenze").value.replace(",", "."));

getElementById holt das Eingabefeld anhand seiner id, .value liefert den eingetippten Text. Dieser Text muss erst in eine Zahl verwandelt werden — das erledigt Number(). Das replace(",", ".") davor tauscht ein deutsches Dezimalkomma gegen den Punkt, den JavaScript intern erwartet.

if (!grenze || isNaN(grenze) || grenze < 1) {
  ausgabe.textContent = "Bitte tragt als Obergrenze eine Zahl ab 1 ein.";
  return;
}

Vor dem Ziehen wird geprüft, ob überhaupt eine brauchbare Obergrenze dasteht. isNaN() heißt „is Not a Number" und erkennt unsinnige Eingaben, das Ausrufezeichen in !grenze fängt leere Felder und die Null ab. Im Fehlerfall erscheint ein Hinweis, und return beendet die Funktion sofort. Das Original zeigte in solchen Fällen kommentarlos NaN an.

const zahl = Math.ceil(Math.random() * grenze);

Das ist der Kern. Math.random() liefert eine Kommazahl größer oder gleich 0 und kleiner als 1, etwa 0,7314. Die Multiplikation mit der Obergrenze streckt diesen Bereich auf 0 bis knapp unter die Grenze — bei 1200 also auf 0 bis 1199,99. Math.ceil() rundet anschließend auf, macht aus 877,68 also 878. Praktisch kommen damit die ganzen Zahlen von 1 bis zur Obergrenze heraus; die Null erschiene nur bei dem verschwindend unwahrscheinlichen Fall, dass Math.random() exakt 0 liefert.

ausgabe.innerHTML = "Gezogen: <strong>" + zahl + "</strong>";

Ausgegeben wird direkt auf der Seite. Weil hier innerHTML statt textContent benutzt wird, darf die Zahl in <strong>-Tags stehen und erscheint hervorgehoben. Die Urfassung öffnete dafür noch ein alert()-Fenster, das man jedes Mal wegklicken musste.

Zum Anpassen: Wollt ihr eine Untergrenze zulassen, etwa Zahlen von 10 bis 50, rechnet ihr Math.floor(Math.random() * (50 - 10 + 1)) + 10. Und wenn die gezogenen Zahlen nicht ersetzt, sondern untereinander gesammelt werden sollen, macht aus dem = in der Ausgabezeile einfach ein +=.

Script für die eigene Homepage

Kopiert euch den kompletten Code und fügt ihn an der Stelle eurer Seite ein, an der das Script erscheinen soll. Er läuft ohne weitere Dateien und ohne fremde Server.

Mehr aus der Kategorie Mathematik