Como remover um elemento de um array em JavaScript (splice, filter e indexOf)

Neste artigo você vai aprender como remover um elemento específico de um array em JavaScript, utilizando recursos próprios da linguagem

Fala programador(a), beleza? Bora aprender mais sobre remoção de elementos e arrays em JavaScript!

A forma mais simples de remover um elemento específico é saber o índice ou encontrá-lo

E aí retirar este elemento com o método splice

Podemos encontrar o índice do elemento com o método indexOf

Veja um exemplo prático sabendo o índice do elemento:

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

var arr = [1,2,3,4,5];

arr.splice(2, 1);

console.log(arr); // [1, 2, 4, 5]

Aqui queremos remover o elemento 3 do array, então sabemos que ele está no índice 2

Pois os elementos do array começam a contar pelo índice 0, então bastou utilizar o splice com o segundo parâmetro como 1 para remover um elemento

Agora vamos a um exemplo que precisamos remover um elemento sem saber o índice do mesmo:

var arr2 = ["Matheus", "João", "Pedro", "Ricardo"];

var indice = arr2.indexOf("Pedro");

arr2.splice(indice, 1);

console.log(arr2); // ["Matheus", "João", "Ricardo"]

Aqui queremos remover o elemento Pedro, então encontramos a posição/índice por meio do método indexOf

E aí realizamos o resto da operação da mesma forma que o exemplo superior, removendo apenas um elemento com splice

Recomendo também a leitura deste artigo, de como obter os valores únicos de um array de forma simples em JavaScript

Conclusão

Neste artigo vimos como remover um elemento específico de um array em JavaScript

Utilizamos duas abordagens: sabendo o índice e descobrindo o índice

Caso precisamos descobrir o índice, podemos fazer isso com o método indexOf

E depois remover o elemento com o splice, e se já soubermos o índice é só aplicar o mesmo ao splice

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube

Removendo um elemento pelo valor com filter (sem alterar o array original):

O splice altera o array original, e às vezes tu não quer isso

Se a ideia é gerar um NOVO array sem um valor específico, o filter resolve numa linha só

var novoArr = arr3.filter(function(item) { return item !== 3; });

Repara que o arr3 continua intacto, o filter devolve um array novo e não mexe no original

Isso é massa quando você trabalha com estado imutável, tipo em React 🙂

Removendo TODAS as ocorrências de um valor:

Tem um detalhe que pega muita gente: o indexOf com splice remove só a PRIMEIRA ocorrência do valor

Se o mesmo elemento aparece várias vezes e você quer tirar todos de uma vez, o filter é o caminho

var semDois = arr4.filter(function(item) { return item !== 2; });

Numa tacada só todos os 2 foram embora

E se eu quiser remover o primeiro ou o último elemento?

Pra esses casos nem precisa de splice

Pra tirar o ÚLTIMO elemento use o pop

arr5.pop();

Pra tirar o PRIMEIRO use o shift

arr6.shift();

Os dois alteram o array original, se liga nisso