Come mescolare (shuffle) un array in JavaScript. Questa procedura torna comoda in diversi casi e in questo articolo scopriamo come fare!
Ciao mi chiamo Lorenzo Neri e sono un informatico: realizzo contenuti per aiutare le persone a padroneggiare l’arte del nuovo millennio, ovvero l’informatica!
Su diversi progetti legati al mondo dello sviluppo web ho avuto particolari momenti frustranti legati a JavaScript: te pensa che ho voluto pure scriverci un articolo dedicato dove parlo di tutte le assurdità che ho scoperto su di lui!
Ma ho voluto fare altrettanto anche con questo articolo e, se lo vorrai, tutti quelli legati a JavaScript che trovi in un colpo di click proprio qui.
Ciò detto, 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 😉
E se così fosse, se questo articolo ti ha risolto un problema, fammelo sapere!
Come? Con un commento proprio qui sotto!
