La semana pasada, analizamos diferentes formas de agregar elementos a una matriz en JavaScript. Hoy, aprenderá cómo eliminar elementos únicos y múltiples de una matriz en JavaScript.
JavaScript proporciona muchas formas de eliminar elementos de una matriz. Puede eliminar un elemento:
- Por su índice numérico.
- Por su valor.
- Desde el principio y el final de la matriz.
Eliminar un elemento por índice
Si ya conoce el índice del elemento de la matriz, simplemente use el método Array.splice() para eliminarlo de la matriz. Este método modifica la matriz original eliminando o reemplazando elementos existentes y devuelve los elementos eliminados, si los hubiere.
Digamos que obtuvo la siguiente matriz y desea eliminar el elemento en el índice 2 (Cherry ):
const fruits = ['Apple', 'Orange', 'Cherry', 'Mango', 'Banana'];
const removed = fruits.splice(2, 1);
console.log(fruits); // ['Apple', 'Orange', 'Mango', 'Banana']
console.log(removed); // ['Cherry']
Quiere eliminar más de uno ¿elementos? Solo pasa la cuenta a Array.splice() como a continuación:
const fruits = ['Apple', 'Orange', 'Cherry', 'Mango', 'Banana'];
const removed = fruits.splice(2, 2);
console.log(fruits); // ['Apple', 'Orange', 'Banana']
console.log(removed); // ['Cherry', 'Mango']
El segundo argumento de Array.splice() es el número de elementos a eliminar. Recuerda que Array.splice() modifica la matriz en su lugar y devuelve una nueva matriz que contiene los elementos que se han eliminado.
Eliminar un elemento por valor
Si conoce el valor del elemento, primero use el Array.indexOf() método para encontrar el índice del elemento en la matriz y luego usar Array.splice() para eliminarlo.
Aquí hay un ejemplo:
const fruits = ['Apple', 'Orange', 'Cherry', 'Mango', 'Banana'];
const index = fruits.indexOf('Mango');
if (index > -1) {
fruits.splice(index, 1);
}
console.log(fruits); // ['Apple', 'Orange', 'Cherry', 'Banana']
Tenga en cuenta que el Array.indexOf() El método devuelve el índice del primer elemento coincidente. Si la matriz contiene varios elementos con los mismos valores, solo se eliminará el primer elemento.
Para filtrar todos los elementos con el mismo valor de una matriz, use el Array.filter() método en su lugar:
const fruits = ['Apple', 'Mango', 'Cherry', 'Mango', 'Banana'];
const filtered = fruits.filter(fruit => fruit !== 'Mango');
console.log(filtered); // ['Apple', 'Cherry', 'Banana']
El Array.filter() El método crea una nueva matriz poblada con todos los elementos de la matriz que pasan una determinada condición. Este método no modifica la matriz original. Echa un vistazo a este artículo para obtener más información sobre el Array.filter() método.
Quitar un elemento del final de una matriz
El Array.pop() El método se puede usar para eliminar un elemento del final de una matriz. Este método elimina el último elemento y lo devuelve:
const fruits = ['Apple', 'Mango', 'Cherry', 'Mango', 'Banana'];
const elem = fruits.pop();
console.log(fruits); // ['Apple', 'Mango', 'Cherry', 'Mango']
console.log(elem); // Banana
Eliminar un elemento del principio de una matriz
El Array.shift() el método funciona exactamente como Array.pop() excepto que elimina un elemento del comienzo de la matriz. Todos los demás elementos se desplazan a un índice más bajo.
const fruits = ['Apple', 'Mango', 'Cherry', 'Mango', 'Banana'];
const elem = fruits.shift();
console.log(fruits); // ['Mango', 'Cherry', 'Mango', 'Banana']
console.log(elem); // Apple
Eliminar todos los elementos de una matriz
Para eliminar todos los elementos de una matriz, simplemente configure el length de la matriz propiedad a 0:
const fruits = ['Apple', 'Mango', 'Cherry', 'Mango', 'Banana'];
// empty an array
fruits.length = 0
console.log(fruits); // []
Eche un vistazo a este artículo para obtener más información sobre las matrices de JavaScript y cómo usarlas para almacenar múltiples piezas de información en una sola variable.