JavaScript | Agregar nuevos elementos al comienzo de una array

Se puede agregar nuevos elementos al comienzo de la array existente utilizando el método Array unshift() . Este método es similar al método push() pero agrega un elemento al comienzo de la array.

Sintaxis:

ArrayObject.unshift( arrayElement );
  • ArrayObject: Es el arreglo, donde insertar el elemento.
  • arrayElement: Es el elemento que se va a insertar.

Ejemplo: este ejemplo inserta el elemento 6 al principio de la array GFG_Array .

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        JavaScript | Insert at beginning
    </title>
</head> 
          
<body style = "text-align:center;"> 
      
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1> 
              
    <p id="up"></p>
      
    <button onclick="myGFG()"> 
        Click to insert
    </button> 
      
    <p id="down" style="color: green"></p>
      
    <!-- Script to add element at beginning of array -->
    <script> 
        var GFG_Array = [1, 2, 3, 4, 5];
        var up = document.getElementById("up");
        up.innerHTML = GFG_Array;
        var down = document.getElementById("down");
        down.innerHTML = "elements of GFG_Array = "
                + GFG_Array;
                  
        function myGFG() {
            GFG_Array.unshift("6");
            down = document.getElementById("down");
            down.innerHTML = "element of GFG_Array = "
                    + GFG_Array;
        }
    </script> 
</body> 
  
</html>                    

Producción:

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

Ejemplo: Este ejemplo inserta el elemento GFG_7 al principio de GFG_Array.

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        JavaScript | Insert at beginning
    </title>
</head> 
          
<body style = "text-align:center;"> 
      
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1> 
              
    <p id="up"></p>
      
    <button onclick="myGFG()"> 
        Click to insert
    </button> 
      
    <p id="down" style="color: green"></p>
              
    <script> 
        var GFG_Array = ["GFG_1", "GFG_2", "GFG_3", "GFG_4"];
        var up = document.getElementById("up");
        up.innerHTML = GFG_Array;
        var down = document.getElementById("down");
        down.innerHTML = "elements of GFG_Array = "
                + GFG_Array;
          
        function myGFG() {
            GFG_Array.unshift("GFG_7");
            down = document.getElementById("down");
            down.innerHTML = "element of GFG_Array = "
                    + GFG_Array;
        }
    </script> 
</body> 
  
</html>                    

Producción:

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

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 *