How to remove random item from array and then remove it from array until array is empty

Question

I am trying to remove a random item from an array until the array is empty using jquery or javascript. I need to console out each time the random item. Basically i am going to create an element with a random image from the given array until all images have been created.

Here is my attempt for getting the random item and removing from array but it it does not go through the entire array-I am stumped.

"load": function(){
    var imgArray = ['brain', 'mitochondria', 'microsope', 'beaker', 'beaker-2', 'scientist', 'cell', 'atom', 'dropper'];
    function randomItem(array){
        var arrayLength = array.length+1;
        console.log(arrayLength);
        for(var i = 0;i<array.length;i++){
            var item = array[Math.floor(Math.random()*array.length)];
            array.pop(item);
            console.log(array);
        }
    }
    randomItem(imgArray);
},

Here is my console output:

10
home.js:12 ["brain", "mitochondria", "microsope", "beaker", "beaker-2", "scientist", "cell", "atom"]
home.js:12 ["brain", "mitochondria", "microsope", "beaker", "beaker-2", "scientist", "cell"]
home.js:12 ["brain", "mitochondria", "microsope", "beaker", "beaker-2", "scientist"]
home.js:12 ["brain", "mitochondria", "microsope", "beaker", "beaker-2"]
home.js:12 ["brain", "mitochondria", "microsope", "beaker"]

Answer 1

The function, Array.prototype.pop() will remove an element from the last. So at this context, you have to use Array.prototype.splice(indext,cnt),

for(var i = array.length-1;i>=0;i--){
  array.splice(Math.floor(Math.random()*array.length), 1);
  console.log(array);
}

And since we are altering the array, we have to traverse it in reverse way, so that the index will not be collapsed.

Answer 2

Just make a random index and splice while length is greater than zero.

var data = ["brain", "mitochondria", "microsope", "beaker", "beaker-2", "scientist", "cell", "atom"];

while (data.length) {
    document.write(data.splice(data.length * Math.random() | 0, 1)[0] + '<br>');
}

Answer 3

Array.prototype.pop removes the last element from the array, not a specific element. To remove an element at a specific index you can use Array.prototype.splice (See: How do I remove a particular element from an array in JavaScript? ).

You also have a problem with for(var i = 0;i<array.length;i++), since array.length changes whenever you remove an item, you'll only get through half the array, you can either loop in reverse for ( var i = array.length; i--; ), so that array.length is only evaluated once, before the first iteration, or you can use a while loop while( array.length ).

Change your loop to:

while( array.length ) {
    var index = Math.floor( Math.random()*array.length );
    console.log( array[index] ); // Log the item
    array.splice( index, 1 ); // Remove the item from the array
}