Pick random and remove from collection using underscore

Question

I've got a collection of 20 results (objects), and what I'd like to do when a button is clicked is to:

a) Pick a random object from this collection/array

b) When the button is pressed again - I don't want that object re-picked until the collection is exhausted (i.e. until the 20 items are shown)

I thought of just splicing out the index of that collection, but I'm hoping for a cleaner way using Underscore.js

EXAMPLE:

var data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11...]

var getRand = _.random(0, data.length);

==> 3

Next time I press the button, I don't want the result "3" to re-appear as it's been used

I hope this makes sense

Answer 1

var data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];

// cache indexes
var cache = _.map(new Array(data.length + 1).join(), function (item, index) {
  return index;
});

// get random from cached array
var rand = _.random(0, cache.length);

// remove random index from cache
cache.splice(rand, 1);

console.log(rand, cache)

Answer 2

var data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
var picked = [];

$("#link").click(function() {
   if(data.length == 0) return;
   var pick = data.splice(_.random(0,data.length),1);
   picked.push(pick);
   $("#pick").html(pick);
   $("#data").html(data.join(","));
   $("#picked").html(picked.join(","));
});

http://jsfiddle.net/Z3vjk/