Math random in JavaScript

In questa lezione impareremo ad utilizzare la funzione math random in JavaScript.

Facciamo subito un esempio di utilizzo della funzione math random che serve a generare i numeri casuali.

Se cliccate sul pulsante si genera un numero casuale tra 0 e 100 e se fate la prova a ricliccare sul pulsante chiaramente il numero cambia.


Primo esempio d’uso della funzione math random in JavaScript

Per implementare questo esempio sviluppiamo una funzione in JavaScript che richiama le funzioni matematiche math.random() e math.round().

La funzione Math.random() genera un numero pseudo-casuale in virgola mobile compreso tra 0 e 1, con 1 escluso.

La funzione Math.round() restituisce il valore di un numero approssimato all’intero ad esso più vicino.

Quindi per generare i numeri casuali da 0 a 100 usiamo Math.random()*100 e poi con la funzione Math.round li arrotondiamo all’intero.

Potevamo utilizzare anche la funzione Math.floor ma Math.floor( Math.random()*100) genera dei numeri da 0 a 99 e quindi per avere i numeri da 0 a 100 avremmo dovuto scrivere: Math.floor(Math.random() * 101).

Ecco dunque la funzione JavaScript:

<script type="text/javascript">
function casuale() {
	num=Math.round(Math.random()*100);
	document.getElementById("casuale").innerHTML ="Numero casuale " + num;
	};
</script>

Creiamo poi in html una casella di input di tipo button per il pulsante, a cui associamo l’evento onclick che richiama la funzione casuale().

<input type="button" onclick="casuale()" value="Genera casuale"></p>
<p id="casuale"></p>

Quindi per generare i numeri da 1 a 6 scrivo: Math.round(Math.random()*5)+1;


Secondo esempio d’uso della funzione math random in JavaScript

In questo secondo esempio chiediamo all’utente quanti numeri casuali si vuole generare e

Quanti numeri generare?

Procediamo generando la funzione per generare i numeri casuali.

Innanzitutto controlliamo che il numero inserito nel campo quanti numeri generare sia compreso tra 1 e 100 con un if. Se lo è procediamo a generare i numeri, altrimenti diamo un messaggio d’avviso all’utente affinchè inserisca un valore compreso tra 1 e 100.

Quindi con un semplice ciclo for genero i numeri e li stampo separati da una virgola.

<script type="text/javascript">
	function casuali() {
		n=parseInt(document.getElementById("quanti").value);
		if (n>0 && n<=100) {
			str = "";
			for (i=0; i<n; i++) {
				num=Math.round(Math.random()*100+1);
				if (i>0)
					str+=", ";	
				str+=num;
			}
			document.getElementById("casuali").innerHTML ="Numeri generati: " + str;
		} else 
			document.getElementById("casuali").innerHTML ="Inserisci un numero maggiore di 0 e inferiore a 100";
	};
</script> 

Ecco il codice html:

<p>Quanti numeri generare? <input type="text" id="quanti"></p>
<input type="button" onclick="casuali()" value="Genera casuali"></p>
<p id="casuali"></p>

Questi sono solo alcuni semplici esempi d’utilizzo della funzione math random in JavaScript.

Alcuni link utili

Indice argomenti tutorial JavaScript

Template responsive con html

Come creare un css responsive

Come trovare immagini per il sito web

Quali colori scegliere per un sito web

Quali font scegliere per un sito web

Autore dell'articolo: cristina

Avatar per Coding Creativo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *