Implement Array Shuffling in MooTools

Written by David Walsh on Monday, February 9, 2009


This article may feature code that is no longer best practice in MooTools.
Click here to learn what has changed to make your code framework-compatible.

While shuffling the order of array elements isn’t a greatly useful function, I recently found myself needing to accomplish the task. I found a great post about how to achieve this feat using jQuery. Here’s how to implement array shuffling in MooTools.

The MooTools Javascript

Array.implement({
	shuffle: function() {
		//destination array
		for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);
		return this;
	}
});

This likely wont be used in the core framework but does have its uses.


Follow via RSS Epic Discussion

Commenter Avatar February 09 / #

Another way (more elegant in my opinion):

Array.implement({
shuffle:function() {
this.sort(function (x,y) { return Math.floor(Math.random()*3)-1; });
return this;
}

});

alert([1,2,3,4,5,6,7,8].shuffle());

David Walsh February 09 / #
david says:

@Elad: Awesome! Nice work. Definitely more elegant.

Commenter Avatar February 09 / #

Just a note that you can do cool stuff like this with Array Shuffling. :)

David Walsh February 09 / #
david says:

@Lim Chee Aun: Awesome!

Commenter Avatar February 10 / #

I’ll point out that @David’s example is guaranteed to not require any additional storage space (it shuffles in place), is unbiased toward permutations, and runs in O(n) time. @Elad’s shuffle depends on the browser’s implementation of sort(). It may require more storage space, it may be biased to certain permutations, and it will run in O(n log n) time or worse due to the nature of sorting. However, I’m guessing that anything shuffled in JS is going to be small and no one will care if it is biased as long as it “seems” random.

Commenter Avatar March 01 / #
olivier says:

I’ve tested both Elad and David script on a 27 lenght array… the shuffling is far better using David’s one….
Anyone for the best of both world : efficiency and elegance ?
Anyway thank you so much for the tip !

Commenter Avatar May 25 / #

I’m trying to learn mootools (both in a general sense, and all over again with 1.2), and javascript OOP at the same time. How I use this to shuffle the order of some list elements on a webpage?

And, if you don’t mind, how would I do this in 1.1 vs. 1.2?

Commenter Avatar July 05 / #

Hehe although the original idea is older than my mom (probably no one here knows the creator of this…), I would be glad if people could copy my things keeping the credits ^^

http://jsfromhell.com/array/shuffle

Be Heard!

I want to hear what you have to say! Share your comments and questions below.

Name*:
Email*:
Website:  


© David Walsh 2007-2010. Contact David Walsh. Powered by the remarkable MooTools javascript framework.