Sort JavaScript array elements in random order

This tutorial shows you how to use a customized function for the sort() method to randomize elements of a JavaScript array (in other words, a custom function to sort array elements in a completely random order). Previous tutorials showed you how to sort array elements with the JavaScript built-in sort() method, and how to create an extended, customized sort() function. This tutorial shows you how to use the random() function from JavaScript's Math object as custom sort function to shuffle array elements.

Creating a JavaScript Array Randomizer

We know that a custom sorting function must either return -1, 0, or +1 based on the parameters you pass to the sort() method. For this first script, we'll make our randomizer sorting function return either 1 or 0.

Without spending too much time on it, JavaScript's Math.random() function returns a floating point number between 0 and 1. To make the random() function return zero or one, we'll need to:

Multiply the floating point by 10 to get an integer plus decimal value
Use the modulus operator to get 1 or 0 from a division by 2
Extract the integer portion of the result

function randomSort(a,b) {
    return( parseInt( Math.random()*10 ) %2 );
}

var arlene = new Array( 1, 2, 3, 4, 5 );
alert( arlene.sort(randomSort).toString() );

Our random sorting function is not as random as it could be, since we are not generating negative values. But it shows how you can easily shuffle, or randomize, array elements with JavaScript.

Write a True Javascript Array Randomizer

The array shuffling function below is more complex than the previous, but will also generate "more randomness" in your returned array:

function randomSort2(a,b) {
    // Get a random number between 0 and 10
    var temp = parseInt( Math.random()*10 );

    // Get 1 or 0, whether temp is odd or even
    var isOddOrEven = temp%2;

    // Get +1 or -1, whether temp greater or smaller than 5
    var isPosOrNeg = temp>5 ? 1 : -1;

    // Return -1, 0, or +1
    return( isOddOrEven*isPosOrNeg );
}

var arlene = new Array( 1, 2, 3, 4, 5 );
alert( arlene.sort(randomSort2).toString() );

Now this function will really shuffle your array elements: our first array randomizing function returned array elements in the same order 50% of the time (statistically); the revised sorter does not.

Note that this is only one of the ways we can create a custom randomizer function for JavaScript arrays. Any algorithm that returns -1, 0, or +1 regardless of array elements passed will do just fine.

Test our array elements randomizer

Interactively test our custom sort function by editing the JavaScript code below and clicking the Test Custom Sort Function button.

Browser support for JavaScript custom sort functions