Eliminar el primer elemento de un array en JavaScript

1. Eliminar el primer elemento de un array cambiando el array original en JavaScript
2. Elimine el primer elemento del array manteniendo el array original sin cambios en JavaScript

El lenguaje de programación JavaScript tiene muchos métodos de compilación previa que pueden ayudarnos a acelerar el proceso de desarrollo. Para cualquier tarea que se le ocurra, siempre habrá un método prediseñado disponible en JavaScript para realizar esa tarea en particular. Por ejemplo, cortar una cadena, insertar y eliminar los elementos del array, convertir un tipo de datos en otro o generar números aleatorios, y muchos más.

De manera similar, al tratar con arrays, algunos métodos útiles nos ayudan a trabajar y manipular las estructuras de datos del array en JavaScript. En este artículo, veremos tres métodos mediante los cuales podemos eliminar el primer elemento del array.

Hay dos tipos de métodos disponibles en JavaScript. Un tipo de método cambiará el array original y el segundo tipo de método mantendrá el array original sin cambios. Si no tiene ningún problema si el array original se altera, utilice los métodos splice() y shift. Pero si no desea cambiar el array original, utilice los métodos filter() y slice.

Eliminar el primer elemento de un array cambiando el array original en JavaScript

1. Método splice():

El método splice() se utiliza para eliminar o reemplazar elementos existentes del array. Este método cambia o modifica el array original. El método splice() también devuelve los elementos que se han eliminado del array. Si desea obtener los elementos eliminados, también puede almacenar ese elemento devuelto en alguna variable para su uso posterior.

Sintaxis:

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

El parámetro inicio nos dice desde qué elemento comenzar a manipular el array. El inicio puede tomar valores positivos o negativos. Si usa los valores positivos (1, 2, 3 …., n) entonces comenzará a cambiar el array de izquierda a derecha, y si usa los valores negativos (-1, -2, -3, .. ., -n) entonces comenzará a cambiar el array de derecha a izquierda.

Luego también tenemos los parámetros deleteCount y item1, item2, ..., ambos opcionales. Si desea eliminar algunos elementos del array, puede pasar el recuento total de los elementos que desea eliminar como un valor al parámetro deleteCount. Si se pasa 0, no se eliminará ningún elemento del array. En item1, item2, ... puede pasar los elementos que desea agregar a el array. Para obtener más información, lea la documentación del método splice().

A continuación tenemos un array de números almacenados dentro de la variable matriz que consta de 5 elementos. En nuestro caso, necesitamos eliminar el primer elemento del array. Aquí, tenemos que especificar el índice de inicio y la cantidad de elementos que queremos eliminar. Como queremos eliminar el primer elemento, nuestro índice inicial sería 0 y el elemento total que necesitamos eliminar es 1. Entonces, pasaremos los valores (0, 1) como parámetro al método splice().

let array = [1, 2, 3, 4, 5] let firstElement = array.splice(0, 1);
console.log(array, firstElement);

También estamos almacenando el elemento eliminado del array en una variable llamada primerElemento. Después de eliminar el primer elemento del array, estamos imprimiendo la matriz y el valor almacenado dentro de la variable firstElement.

Puede ejecutar el código anterior pegándolo en la consola del navegador y luego obtendrá el resultado de la siguiente manera.

Producción :

Array(4) [ 2, 3, 4, 5 ]
Array [ 1 ]

Como puede ver en la salida, el primer elemento, en este caso, 1 se elimina correctamente del array original.

2. Método shift():

Otra forma de eliminar el primer elemento del array es mediante el método shift(). Con el método splice(), puede agregar o eliminar cualquier elemento en cualquier índice del array, pero el método shift() se usa específicamente para eliminar el elemento en el índice 0 únicamente. Elimina el primer elemento (elemento presente en el índice 0) y mueve los elementos restantes del array hacia la izquierda.

Este método también devuelve el elemento que se ha eliminado del array. Aquí, también hemos creado una variable firstElement que almacenará el primer elemento eliminado del array.

let array = [1, 2, 3, 4, 5];
let firstElement = array.shift();
console.log(array, firstElement);

Finalmente, imprimiremos las variables array y firstElement.

Producción :

Array(4) [ 2, 3, 4, 5 ]
1

Elimine el primer elemento del array manteniendo el array original sin cambios en JavaScript

1. Método filter():

Hemos visto los métodos que cambian o modifican el array original; Veamos ahora algunos métodos que mantienen el array original como está y almacenan los resultados de la operación en una nueva matriz. Uno de estos métodos es el método filter().

El método filter() funciona según la condición. Y en función de si la condición es verdadera o falsa, decide si agregar los elementos a una nueva matriz o no.

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.filter((element, index) => index > 0);
console.log(array_1, array_2);

El método filter() toma una función de devolución de llamada (función de flecha) como argumento. Esta función de devolución de llamada se llama en cada elemento del array. Esta función nos dará el element del array y su index.

Como queremos eliminar el primer elemento, agregaremos una condición de que el índice del elemento sea mayor que cero o no (index > 0). Si esto es cierto, entonces solo la función filter() insertará el elemento en la nueva matriz y no de otra manera. Todos los demás elementos se insertarán en la nueva matriz excepto el elemento en el índice 0 (es decir, el primer elemento).

Producción :

Array(5) [ 1, 2, 3, 4, 5 ]
Array(4) [ 2, 3, 4, 5 ]

2. Método slice():

El siguiente método que mantiene el array original es el método slice(). El método slice() corta el array en dos lugares. Para eso, tenemos que especificar el índice inicial y final. El inicio representa el primer índice desde donde queremos comenzar a cortar el array, y el corte detendrá un elemento antes del final.

Cualquier elemento presente dentro de start y end (incluido el valor de inicio y detener un elemento antes del final) se insertará en la nueva matriz. Ambos parámetros son opcionales. Para obtener más información, lea la documentación del método slice().

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.slice(1);
console.log(array_1, array_2);

Pasaremos el parámetro start sólo porque queremos eliminar el primer elemento del array. No especificar el end significa que se incluirán todos los elementos del array a partir del valor start. En nuestro caso, pasaremos slice(1). Esto copiará los elementos [2,3,4,5] del array original, es decir, array_1 en array_2. Al final, imprimiremos ambas matrices usando el método console.log(). La salida del código anterior es como se muestra a continuación.

Producción :

Array(5) [ 1, 2, 3, 4, 5 ]
Array(4) [ 2, 3, 4, 5 ]