Publicado em por Paulo Künzel

Removendo Elementos de uma Lista (Array) JavaScript


Se você quiser saber como adicionar elementos, veja esse post sobre o assunto.

A remoção de elementos de um array JavaScript é um paradigma de programação comum que os desenvolvedores costumam executar. Tal como acontece com muitas coisas JavaScript, isto não é tão simples como provavelmente deveria ser. Na verdade, existem várias maneiras de remover um ou mais elementos de um vetor/array – sem arrancar os cabelos no processo -, então vamos passar por cada um deles, um por um.

Removendo um elemento usando splice()

O método splice() é uma maneira versátil de remover, substituir e / ou adicionar elementos em um vetor/array. Ele funciona de forma semelhante às funções splice() em outras linguagens de programação. Basicamente, você pega um vetor e remove seletivamente partes dela (também conhecidas como “splice”). As entradas para a função splice() são o ponto de índice para iniciar em e o número de elementos a serem removidos. Para remover um elemento de um índice específico em um vetor:

let list = ["bar", "baz", "foo", "qux"];



list.splice(2, 1);

// Começando na posição do índice 2, remova um elemento

// ["bar", "baz", "qux"]



list.splice(2,2);

// Começando na posição do índice 2, remova dois elementos

// ["bar", "baz"]

 

A chamada splice() retornará todos os elementos removidos, para que você saiba o que foi realmente removido.

Removendo um intervalo de elementos usando splice()

Só para ter certeza de que você entendeu o exemplo anterior, vale a pena mencionar especificamente que você pode remover vários elementos consecutivos com splice(). Para remover vários elementos consecutivos de um vetor/array:

list = ["bar", "baz", "foo", "qux"];

list.splice(0, 2);

// Iniciando na posição do índice 0, remova dois elementos
//["foo", "qux"];

 

Removendo um elemento usando pop()

Os métodos push() e pop() funcionam no final de um array. Os termos push() e pop() vêm da ideia de uma pilha na memória desde os primeiros dias dos microprocessadores. Isso implementa a ideia de uma estrutura de dados Last-In-First-Out (LIFO). Para remover o último elemento de um vetor:

let list = ["bar", "baz", "foo", "qux"];

list.pop();
//["bar", "baz", "foo"]

 

Removendo um elemento usando shift()

Os métodos shift() e unshift() funcionam no início de um vetor ao invez do final dele, como é o caso de push() e pop(). O comando shift() removerá o primeiro elemento e o comando unshift() adicionará um elemento ao início do vetor/array em questão.Para remover o primeiro elemento:

let list = ["bar", "baz", "foo", "qux"];

list.shift();
// ["baz", "foo", "qux"]

 

Pesquisando e removendo um elemento específico por valor

O comando indexOf() retorna o primeiro índice no qual um determinado elemento pode ser encontrado no vetor e -1 se não estiver presente. Isso pode ser usado junto com splice() para procurar um elemento e, em seguida, removê-lo, mesmo que você não saiba onde ele está no array. Vamos remover o elemento “foo”:

let list = ["bar", "baz", "foo", "qux"];

list.splice(list.indexOf('foo'), 1);
// Encontre a posição do índice de "foo", então remova um elemento dessa posição

 

Removendo vários elementos específicos

Vamos adicionar diversos elementos “foo” ao nosso array e, em seguida, remover todas essas ocorrências de “foo”:

let list = ["bar", "baz", "foo", "qux", "foo", "foo", "asd", "ffd", "baz"];
let buscarPor = "foo"
let indice = list.indexOf(buscarPor);

while(indice >= 0){
    list.splice(indice, 1);
    indice = list.indexOf(buscarPor);
}

console.log(list);

Conclusão

Quando se trata disso, remover elementos de vetores em JavaScript é bastante simples. As convenções de nomenclatura podem ser um pouco estranhas no início, mas uma vez que você faça isso algumas vezes, você será capaz de fazer isso sem pensar duas vezes (ou uma segunda olhada neste artigo). Novamente, se você quiser saber como adicionar elementos, veja esse post sobre o assunto.

Deixe um comentário