Eliminar elementos en una matriz JavaScript

Facebooktwittergoogle_pluslinkedinmailFacebooktwittergoogle_pluslinkedinmail

Las matrices en JavaScript son un recurso muy interesante (imprescindible, en muchos casos) a la hora de gestionar datos en el lado del cliente. Desafortunadamente, la gestión de matrices en JavaScript adolece de ciertas limitaciones importantes que los desarrolladores acostumbrados al backend y sus poderosas herramientas (léase PHP, por ejemplo) acusamos en gran manera. Sin embargo, sí cuentan con determinadas funcionalidades que es importante conocer. Una de estas, que vamos a tratar en este artículo, es la eliminación de un determinado elemento situado en un lugar concreto dentro de una matriz.

¿VACIAR O ELIMINAR?

Esto es lo primero que debe quedar claro. No es lo mismo vaciar un elemento de una matriz, que eliminarlo. En el primer caso, el elemento sigue estando en la matriz, aunque, si tratamos de leer su contenido, obtendremos un valor undefined. En el segundo caso, el elemento desaparece completamente, como si nunca hubiera estado allí. ¿Cúal es la solución mejor? Nadie podría responder esa pregunta. Por supuesto, eso depende de las necesidades operativas de cada desarrollo concreto. En este artículo vamos a ver cómo hacer ambas operaciones (el vaciado y la eliminación) y serás tú quien tenga que optar por una u otra en cada caso.

Para entender como funcionan ambas operaciones, vamos a partir, en los dos casos, de la declaración de la siguiente matriz:

Cómo ves, se trata de una matriz muy simplona. Los elementos, cómo ya sabes, son indexados con un valor numérico que empieza en 0, por lo que elemento 1 tendrá el índice 0, elemento 2 el índice 1, etc. Si ahora visualizamos esta matriz en la consola del navegador con la instrucción console.log (matriz); veremos lo siguiente:

Si tienes dudas acerca de cómo usar la consola de tu navegador, revisa este enlace y este otro.

Como ves, aparece la matriz con todos sus elementos, tal cómo la hemos declarado.

VACIADO DE UN ELEMENTO

Sobre la matriz que acabamos de ver, podemos actuar vaciando un elemento. Suponte que necesitas vaciar el tercer elemento (el que tiene el índice 2). Hay dos maneras de hacerlo. La primera es la más obvia:

matriz[2] = undefined;

La alternativa es la instrucción delete, así:

delete matriz[2];

En ambos casos, el resultado, si visualizamos la matriz de nuevo en la consola, es el siguiente:

Como ves, el elemento sigue existiendo (aunque con el valor undefined), y la matriz sigue teniendo cuatro elementos, como ves en la última línea.

Cabe decir que, para vaciar un elemento de una matriz puedes usar el valor null, en lugar de undefined. Aunque, para determinadas operaciones de JavaScript estos valores no siempre son intercambiables, a estos efectos sí que lo son. El elemento seguirá estando en su posición, pero sin valor.

ELIMINACIÓN

Y si queremos eliminar completamente uno o más elementos, las matrices de JavaScript cuentan con el método splice(). Este recibe dos argumentos numéricos: el primero es el índice del elemento a partir del cual queremos empezar a eliminar; el segundo es el número de elementos que queremos eliminar a partir del indicado en el primer parámetro. Por lo tanto, si queremos eliminar el tercer elemento (que tiene el índice 2), escribiremos:

matriz.splice(2, 1);

Si hacemos esto partiendo de la matriz que hemos visto al principio de este artículo y, a continuación la volcamos en la consola, obtendremos el siguiente resultado:

Cómo ves, el que era el cuarto elemento es ahora el tercero. El que era el tercero originalmente ha desaparecido completamente, sin dejar rastro. Además, vemos que la matriz ahora tiene una longitud de tres elementos, en lugar de cuatro.

     

Deja un comentario

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