Math random in JavaScript — CodingCreativo

La funzione Math.random in JavaScript consente di generare un numero decimale pseudo-casuale tra 0 compreso e 1 escluso.

Facciamo subito un esempio di utilizzo della seguente funzione.

Primo esempio d'uso della funzione math random in JavaScript

Fate la prova a cliccare sul pulsante sotto 'genera casuale'. Si genera un numero casuale tra 0 e 100 e se fate la prova a cliccare nuovamente sul pulsante chiaramente il numero cambia. Quindi di volta in volta si genera un nuovo numero.

Da zero ad eroe

Entra nel mondo della programmazione web: variabili, funzioni, array, DOM, eventi. Con esercizi pratici e progetti coinvolgenti.

8 ore di corso registrato
Più di 50 algoritmi risolti passo passo
Livello base — da zero ad eroe
100% online, fruibile quando vuoi

Per implementare questo esempio sviluppiamo una funzione che richiami le funzioni 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.

Ricordiamo che 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 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:


function casuale() {
    num = Math.round(Math.random() * 100);
    document.getElementById("casuale").innerHTML ="Numero casuale " + num;
}

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 id="casuale"></p>

Quindi ad esempio se voglio 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 vuole generare, trascrivendoli in una casella di input. Dunque clicchiamo sul pulsante e li generiamo.

Scrivi nella casella sotto quanti numeri vuoi generare.

Procediamo generando la funzione Math.random 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.

Utilizziamo la funzione parseInt per restituire comunque un numero intero.

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


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";
   }
}

Ecco il codice html:

<p>Quanti numeri generare? 
   <input type="text" id="quanti">
   <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.

Lezione precedente: funzione eval in JavaScript

Lezione successiva: funzione Math floor in JavaScript