Pop random element from array javascript

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"]


We are given an array of string / number literals. We are required to create a function removeRandom() that takes in the array and recursively removes one random item from the array and simultaneously printing it until the array contains items.

This can be done through creating a random number using Math.random() and removing the item at that index using Array.prototype.splice() and printing it until the length of array shrinks to 0.

Here is the code for doing the same −

Example

const arr = ['Arsenal', 'Manchester United', 'Chelsea', 'Liverpool',
'Leicester City', 'Manchester City', 'Everton', 'Fulham', 'Cardiff City'];
const removeRandom = (array) => {
   while(array.length){
      const random = Math.floor(Math.random() * array.length);
      const el = array.splice(random, 1)[0];
      console.log(el);
   }
};
removeRandom(arr);

The output in console can be −

Note − As it is a random output, it is likely to differ every time, so this is just one of many possible outputs.

Output

Leicester City
Fulham
Everton
Chelsea
Manchester City
Liverpool
Cardiff City
Arsenal
Manchester United

Pop random element from array javascript

Updated on 19-Aug-2020 07:26:42

  • Related Questions & Answers
  • MongoDB query to remove item from array?
  • How to remove an item from JavaScript array by value?
  • Remove item from a nested array by indices in JavaScript
  • How can I remove a specific item from an array JavaScript?
  • Remove element from array referencing spreaded array in JavaScript
  • Remove/ filter duplicate records from array - JavaScript?
  • PHP: Remove object from array
  • How can I remove a specific item from an array in JavaScript
  • Python program to Remove and print every third from list until it becomes empty?
  • Remove elements from array using JavaScript filter - JavaScript
  • Remove '0','undefined' and empty values from an array in JavaScript
  • Remove duplicates from a array of objects JavaScript
  • Remove object from array in MongoDB?
  • Remove null element from MongoDB array?
  • Remove elements from array in JavaScript using includes() and splice()?

In this Article we will go through how to get a random item and remove it from an array only using single line of code in JavaScript. This is a one-line JavaScript code snippet that uses one of the most popular ES6 features => Arrow Function.

Let's define this short function:

const randomItem = arr => arr.splice((Math.random() * arr.length) | 0, 1);

#Example

const arr = [1, 3, 5, 7, 9];
randomItem(arr);    // 7
                    // arr = [1, 3, 5, 9]

View Discussion

Improve Article

Save Article

  • Read
  • Discuss
  • View Discussion

    Improve Article

    Save Article

    The task is to select the random element from the array using JavaScript.
    Approach 1: 

    • Use Math.random() function to get the random number between(0-1, 1 exclusive).
    • Multiply it by the array length to get the numbers between(0-arrayLength).
    • Use Math.floor() to get the index ranging from(0 to arrayLength-1).

    Example: This example implements the above approach.  

    html

    <!DOCTYPE HTML>

    <html>

    <head>

        <title>

            How to select a random element

            from array in JavaScript ?

        </title>

    </head>

    <body style = "text-align:center;">

        <h2 style = "color:green;">

            GeeksForGeeks

        </h2>

        <p id = "GFG_UP" style =

            "font-size: 15px; font-weight: bold;">

        </p>

        <button id = "button" onclick = "GFG_Fun()">

            click here

        </button>

        <p id = "GFG_DOWN" style =

            "font-size: 24px; font-weight: bold; color: green;">

        </p>

        <script>

            var up = document.getElementById('GFG_UP');

            var down = document.getElementById('GFG_DOWN');

            var arr = ["GFG_1", "GeeksForGeeks",

                    "Geeks", "Computer Science Portal"];

            up.innerHTML = "Click on the button to check "

                   + "the type of element.<br><br>" + arr;

            function GFG_Fun() {

                down.innerHTML =

                    arr[Math.floor(Math.random() * arr.length)];

            }

        </script>

    </body>

    </html>

    Output: 

    • Before clicking on the button:

    Pop random element from array javascript

    • After clicking on the button: 

    Pop random element from array javascript

    Approach 2:  

    • The random(a, b) method is used to generates a number between(a to b, b exclusive).
    • Taking the floor value to range the numbers from (1 to arrayLength).
    • Subtract 1 to get the index ranging from(0 to arrayLength-1).

    Example: This example implements the above approach. 

    html

    <!DOCTYPE HTML>

    <html>

    <head>

        <title>

            How to select a random element

            from array in JavaScript ?

        </title>

    </head>

    <body style = "text-align:center;">

        <h2 style = "color:green;">

            GeeksForGeeks

        </h2>

        <p id = "GFG_UP" style =

            "font-size: 15px; font-weight: bold;">

        </p>

        <button id = "button" onclick = "GFG_Fun()">

            click here

        </button>

        <p id = "GFG_DOWN" style =

            "font-size: 24px; font-weight: bold; color: green;">

        </p>

        <script>

            var up = document.getElementById('GFG_UP');

            var down = document.getElementById('GFG_DOWN');

            var arr = ["GFG_1", "GeeksForGeeks",

                    "Geeks", "Computer Science Portal"];

            up.innerHTML = "Click on the button to select"

                            + " random element from the"

                            + " array.<br><br>" + arr;

            function random(mn, mx) {

                return Math.random() * (mx - mn) + mn;

            }

            function GFG_Fun() {

                down.innerHTML = arr[Math.floor(random(1, 5))-1];

            }

        </script>

    </body>

    </html>

    Output: 

    • Before clicking on the button: 

    Pop random element from array javascript

    • After clicking on the button: 

    Pop random element from array javascript

    JavaScript is best known for web page development but it is also used in a variety of non-browser environments. You can learn JavaScript from the ground up by following this JavaScript Tutorial and JavaScript Examples.


    Can you pop a specific element from array in JavaScript?

    You can remove elements from the end of an array using pop, from the beginning using shift, or from the middle using splice. The JavaScript Array filter method to create a new array with desired items, a more advanced way to remove unwanted elements.

    How do you get random elements from an array?

    Approach 1:.
    Use Math. random() function to get the random number between(0-1, 1 exclusive)..
    Multiply it by the array length to get the numbers between(0-arrayLength)..
    Use Math. floor() to get the index ranging from(0 to arrayLength-1)..

    Does pop remove element from array JavaScript?

    pop() The pop() method removes the last element from an array and returns that element. This method changes the length of the array.

    How do you generate a random value from an array in Python?

    Use the numpy.random.choice() function to generate the random choices and samples from a NumPy multidimensional array. Using this function we can get single or multiple random numbers from the n-dimensional array with or without replacement.