Cómo eliminar un elemento de un arreglo por su valor en JavaScript

Los arreglos son una estructura de datos fundamental en la programación. Muchas veces necesitamos eliminar elementos específicos de un arreglo según su valor, pero no sabemos cómo hacerlo de forma eficiente en JavaScript. En este artículo, aprenderemos paso a paso cómo eliminar un elemento de un arreglo por su valor utilizando diferentes métodos en JavaScript.

📋 Aquí podrás encontrar✍

Usando filter()
Usando splice()
Usando for loop
Ejemplos de código
Conclusión
Preguntas frecuentes

Usando filter()

Una forma sencilla de eliminar un elemento de un arreglo por su valor es utilizando el método filter(). Este método nos permite crear un nuevo arreglo a partir del arreglo original, excluyendo los elementos que no cumplen cierta condición. En nuestro caso, la condición es que el valor del elemento sea diferente al valor que queremos eliminar.

Para utilizar el método filter() debemos seguir los siguientes pasos:

Definir el arreglo original.
Especificar la condición de filtrado. En este caso, utilizaremos una función callback que compare el valor del elemento con el valor que queremos eliminar. Si los valores son iguales, devolvemos false para excluir ese elemento del nuevo arreglo.
Guardar el nuevo arreglo resultante en una variable.

let originalArray = [1, 2, 3, 4, 5]; let valueToRemove = 3;

let filteredArray = originalArray.filter(function(element) { return element !== valueToRemove; });

En este ejemplo, hemos eliminado el número 3 del arreglo original. El nuevo arreglo resultante es [1, 2, 4, 5].

Usando splice()

Otra forma de eliminar un elemento de un arreglo por su valor es utilizando el método splice(). Este método nos permite eliminar elementos específicos del arreglo modificando el arreglo original. En nuestro caso, necesitamos buscar el índice del elemento que queremos eliminar para luego usar el método splice().

Para utilizar el método splice() debemos seguir los siguientes pasos:

Definir el arreglo original.
Buscar el índice del elemento que queremos eliminar utilizando el método indexOf(). Este método nos devuelve el índice del primer elemento encontrado que coincida con el valor especificado.
Utilizar el método splice() para eliminar ese elemento del arreglo original. El método splice() recibe dos parámetros: el índice donde empezar la eliminación y la cantidad de elementos a eliminar.

let originalArray = [1, 2, 3, 4, 5]; let valueToRemove = 3;


let indexToRemove = originalArray.indexOf(valueToRemove);

if (indexToRemove > -1) { originalArray.splice(indexToRemove, 1); }

En este ejemplo, hemos eliminado el número 3 del arreglo original. El arreglo original modificado es [1, 2, 4, 5].

Usando for loop

También podemos eliminar un elemento de un arreglo por su valor utilizando un for loop. Este método nos permite buscar el índice del elemento que queremos eliminar y luego usar el método splice(), similar a lo que hicimos en el método anterior.

Para utilizar el for loop, debemos seguir los siguientes pasos:

Definir el arreglo original.
Buscar el índice del elemento que queremos eliminar utilizando el for loop y una sentencia if. Si encontramos el índice del elemento, salimos del for loop utilizando la sentencia break.
Utilizar el método splice() para eliminar ese elemento del arreglo original.

let originalArray = [1, 2, 3, 4, 5]; let valueToRemove = 3;

for (let i = 0; i < originalArray.length; i++) { if (originalArray[i] === valueToRemove) { originalArray.splice(i, 1); break; } }

En este ejemplo, hemos eliminado el número 3 del arreglo original. El arreglo original modificado es [1, 2, 4, 5].

Ejemplos de código

Aquí te dejamos algunos ejemplos de cómo usar los métodos descritos anteriormente:

Eliminar un string de un arreglo de strings:
let originalArray = ['hola', 'adios', 'saludos']; let valueToRemove = 'adios';

let filteredArray = originalArray.filter(function(element) { return element !== valueToRemove; });

El nuevo arreglo resultante es ['hola', 'saludos'].

Eliminar un objeto de un arreglo de objetos:
let originalArray = [ {id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}, {id: 3, name: 'Charlie'} ];


let valueToRemove = {id: 2, name: 'Bob'};

let filteredArray = originalArray.filter(function(element) { return element.id !== valueToRemove.id && element.name !== valueToRemove.name; });

El nuevo arreglo resultante es [{id: 1, name: 'Alice'}, {id: 3, name: 'Charlie'}].

Conclusión

Eliminar un elemento de un arreglo por su valor es una tarea común en la programación. En este artículo, hemos aprendido diferentes métodos para lograr este objetivo en JavaScript. Los métodos filter() y splice() son muy útiles para crear un nuevo arreglo sin modificar el original o modificar el arreglo original directamente, respectivamente. El for loop también es una opción viable para este propósito. Esperamos que este artículo haya sido útil para ti.

Preguntas frecuentes

¿Puedo utilizar estos métodos para eliminar múltiples elementos de un arreglo?

Sí, puedes. Para eliminar múltiples elementos de un arreglo por su valor, debes repetir el proceso descrito en este artículo para cada valor que quieras eliminar.

¿Qué sucede si el valor que quiero eliminar no está en el arreglo?

Si el valor que quieres eliminar no está en el arreglo, los métodos filter() y splice() no modificarán el arreglo. El for loop tampoco modificará el arreglo si no se encuentra el valor.

¿Qué sucede si hay múltiples elementos en el arreglo con el mismo valor que quiero eliminar?

Los métodos filter() y splice() eliminarán todos los elementos que cumplan la condición de filtrado o el rango de eliminación, respectivamente. Si usas un for loop, eliminarás solo el primer elemento encontrado con el valor especificado.