¿Cómo seleccionar un elemento aleatorio de una array en JavaScript?

La tarea es seleccionar el elemento aleatorio de la array usando JavaScript.
Enfoque 1: 

  • Use la función Math.random() para obtener el número aleatorio entre (0-1, 1 exclusivo).
  • Multiplíquelo por la longitud de la array para obtener los números entre (0-arrayLength).
  • Use Math.floor() para obtener el índice que va desde (0 hasta arrayLength-1).

Ejemplo: Este ejemplo implementa el enfoque anterior.  

html

<!DOCTYPE HTML>
<html>
 
<head>
    <title>
        How to select a random element
        from array in JavaScript ?
    </title>
</head>
 
<body style = "text-align:center;">
     
    <h1 style = "color:green;">
        GeeksForGeeks
    </h1>
     
    <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>

Producción: 

  • Antes de hacer clic en el botón:

  • Después de hacer clic en el botón: 

Enfoque 2:  

  • El método aleatorio (a, b) se utiliza para generar un número entre (a a b, b exclusivo).
  • Tomando el valor mínimo para variar los números de (1 a arrayLength).
  • Resta 1 para obtener el índice que va desde (0 hasta arrayLength-1).

Ejemplo: Este ejemplo implementa el enfoque anterior. 

html

<!DOCTYPE HTML>
<html>
 
<head>
    <title>
        How to select a random element
        from array in JavaScript ?
    </title>
</head>
 
<body style = "text-align:center;">
     
    <h1 style = "color:green;">
        GeeksForGeeks
    </h1>
     
    <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>

Producción: 

  • Antes de hacer clic en el botón: 

  • Después de hacer clic en el botón: 

JavaScript es mejor conocido por el desarrollo de páginas web, pero también se usa en una variedad de entornos que no son de navegador. Puede aprender JavaScript desde cero siguiendo este tutorial de JavaScript y ejemplos de JavaScript .

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *