Resumen

En esta entrada te mostraré cómo podemos eliminar un elemento de un array en JavaScript, ya sea a partir de su índice o a partir de su valor.

Vamos a usar el método splice de los arreglos en JavaScript, acompañado en alguna ocasión de indexOf o de findIndex según sea el caso.

El método splice de los arrays en JS

Este método bien ha de servir para otros propósitos, pero también sirve para eliminar un item de un arreglo en JavaScript.

Su sintaxis, para estos usos, es:

See the gist on github.

¿Por qué?

Porque splice toma:

1. Posición desde donde se comienza a eliminar
2. Cuántos elementos eliminar
3. Otros elementos que se insertan en donde se eliminó el elemento (de hecho acepta parámetros infinitos después del 2, que son los elementos que se insertan).

Como en este caso solo queremos eliminar uno, se usa de la forma que dije:

See the gist on github.

Nota: esta función modifica al arreglo, de manera interna. Lo que devuelve son los elementos eliminados.

Ejemplo de splice

Veamos un ejemplo sencillo con el siguiente código:

See the gist on github.

Estamos eliminando el elemento número 1 del arreglo. Si quisiéramos eliminar el primero, usaríamos el índice 0 y así sucesivamente.

El arreglo es modificado internamente, no lo olvides.

Prueba el código aquí.

El problema del índice

Ya vimos cómo eliminar un elemento de un arreglo a través del índice o posición, pero en ocasiones no tenemos ese índice.

Si queremos eliminar a partir del valor, simplemente hay que obtener el índice con indexOf o findIndex.

Vamos a ver otro ejemplo:

See the gist on github.

En este caso obtenemos el índice usando la función indexOf, pues fue un arreglo de datos primitivos.

Recuerda que indexOf puede devolver -1 si no encuentra el elemento, deberías hacer esa comprobación antes de llamar a splice.

Prueba el código aquí.

Eliminar elemento de arreglo con splice y findIndex

Para terminar estos ejemplos de splice en JavaScript vamos a ver cómo eliminar un objeto a partir de una propiedad que tenga.

See the gist on github.

Aunque se vea parecido, recordemos que el id no es lo mismo que el índice.

En este caso estamos eliminando del arreglo una materia a partir de su id.

Prueba el código aquí.

Conclusión

Recuerda: si quieres eliminar más de un elemento a partir de ese índice simplemente cambia el segundo argumento.

También puedes agregar elementos al arreglo en donde el otro fue eliminado, pasando argumentos después del segundo. Por ejemplo:

arr.splice(0,1, "un elemento", "otro elemento", ...)