Come mescolare (shuffle) un array in JavaScript

di Lorenzo Neri
0 commento 182 visualizzazioni

Come mescolare (shuffle) un array in JavaScript. Questa procedura torna comoda in diversi casi e in questo articolo scopriamo come fare!

Partiamo dalle basi.

Abbiamo un array :

var array = [1,2,3,4,5,6,7,8,9];

Il nostro obiettivo, una volta valorizzato, è quello di renderlo randomico, quindi mescolare il contenuto dell’array in maniera casuale.

In gergo tecnichese, vogliamo fare uno shuffle 😀

Ragioniamo su come fare!

Di cosa abbiamo bisogno?

Dobbiamo sapere la lunghezza dell’array.

Una volta fatto ciò possiamo creare una funzione in modo tale da poterla poi usare anche per altri array!

Perciò, per eseguire uno shuffle in JavaScript fatto per bene e universalizzato, prendiamo come esempio questa funzione che commentiamo assieme:

function mescola(array) {

  //Ci prendiamo la lunghezza dell'array e partiamo dal fondo!
  var currentIndex = array.length, temporaryValue, randomIndex;

  // Finché ci sono elementi da mescolare, iteriamo l'array
  while (0 !== currentIndex) {

    //Prendiamo un indice a caso dell'array, purché sia compreso tra 0 e la lunghezza dell'array
    randomIndex = Math.floor(Math.random() * currentIndex);

    //Riduciamo di un'unità l'indice corrente
    currentIndex -= 1;

    // Una volta che abbiamo preso l'indice casuale, invertiamo l'elemento che stiamo analizzando alla posizione corrente (currentIndex) con quello alla posizione presa casualmente (randomIndex)

    //Variabile temporanea
    temporaryValue = array[currentIndex];
    //Eseguiamo lo scambio
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }
  //Torniamo l'array mescolato a fine ciclo
  return array;
}

Ecco come mescolare, quindi fare lo shuffle in un array in JavaScript

Riassumiamo assieme i passi del seguente algoritmo che abbiamo fatto:

  • Ci prendiamo la lunghezza dell’array e partiamo dal fondo nella sua iterazione
  • Iteriamo l’array finché non abbiamo iterato ogni suo singolo elemento
  • Ci creiamo un indice preso casualmente e compreso tra la posizione zero e la posizione massima dell’array
  • Ci creiamo una variabile temporanea
  • Scambiamo il valore alla posizione il cui indice è quello creato casualmente prima con quello alla posizione corrente del ciclo che stiamo usando per iterare l’array
  • Ripetiamo finché non abbiamo iterato l’array per intero

E come usare tutto questo ben di dio?

Semplice!

Così:

 var vettore = [1,2,3,4,5,6,7,8,9];
 mescola(arr);


Semplice, rapido e immediato.

Funziona anche con array di oggetti, stringhe, tutto!

Se ti stessi chiedendo come mescolare un array di oggetti, stringhe o qualsiasi altra cosa in JavaScript, beh…

Il metodo che abbiamo appena creato assieme funziona per qualsiasi array a prescindere dal suo contenuto

Provalo e scoprilo da te 😉

Potrebbero interessarti

Lascia un commento

Questo sito potrebbe fare uso di cookie e siccome l'UE mi obbliga a fartelo presente, eccoti il classico banner dove puoi decidere come gestirli. Accetta Leggi di più