Remover o primeiro elemento de um array em JavaScript

1. Remova o primeiro elemento de um array alterando a matriz original em JavaScript
2. Remova o primeiro elemento do array mantendo a matriz original inalterada em JavaScript

A linguagem de programação JavaScript tem muitos métodos de pré-construção que podem nos ajudar a tornar o processo de desenvolvimento mais rápido. Para qualquer tarefa que você possa pensar, sempre haverá um método pré-criado disponível em JavaScript para fazer essa tarefa específica. Por exemplo, fatiar uma string, inserir e excluir os elementos do array, converter um tipo de dados em outro ou gerar números aleatórios e muitos mais.

Da mesma forma, ao lidar com matrizes, alguns métodos úteis nos ajudam a trabalhar e manipular as estruturas de dados de arrayes em JavaScript. Neste artigo, veremos três métodos usando os quais podemos remover o primeiro elemento do array.

Existem dois tipos de métodos disponíveis em JavaScript. Um tipo de método mudará a matriz original e o segundo tipo de método manterá a matriz original inalterada. Se você não tiver problemas se o array original for alterado, vá com os métodos splice() e shift. Mas se você não quiser alterar o array original, vá com os métodos filter() e slice.

Remova o primeiro elemento de um array alterando a matriz original em JavaScript

1. Método splice():

O método splice() é usado para remover ou substituir elementos existentes do array. Este método altera ou modifica a matriz original. O método splice() também retorna os elementos que foram removidos do array. Se você deseja obter os elementos excluídos, também pode armazenar o elemento retornado em alguma variável para uso posterior.

Sintaxe:

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

O parâmetro start nos diz de qual elemento começar a manipular o array. O parâmetro start pode assumir valores positivos ou negativos. Se você usar os valores positivos (1, 2, 3 …., n), ele começará a mudar a matriz da esquerda para a direita, e se você usar os valores negativos (-1, -2, -3, .. ., -n) então ele começará a mudar a matriz da direita para a esquerda.

Então, também temos os parâmetros deleteCount e item1, item2, ..., ambos opcionais. Se você deseja excluir alguns elementos do array, pode passar a contagem total dos elementos que deseja excluir como um valor para o parâmetro deleteCount. Se for passado por 0, nenhum elemento será excluído do array. Em item1, item2, ... você pode passar os elementos que deseja adicionar ao array. Para obter mais informações, leia a documentação do método splice().

Abaixo, temos um array de números armazenados dentro da variável array que consiste em elementos 5. Em nosso caso, precisamos deletar o primeiro elemento do array. Aqui, temos que especificar o índice inicial e o número de elementos que queremos excluir. Como queremos remover o primeiro elemento, nosso índice inicial seria 0 e o elemento total que precisamos excluir é 1. Portanto, passaremos os valores (0, 1) como um parâmetro para o método splice().

let array = [1, 2, 3, 4, 5] let firstElement = array.splice(0, 1);
console.log(array, firstElement);

Também estamos armazenando o elemento excluído do array em uma variável chamada firstElement. Depois de remover o primeiro elemento do array, estamos imprimindo o array e o valor armazenado dentro da variável firstElement.

Você pode executar o código acima colando-o no console do navegador e obterá a saída da seguinte forma.

Produção:

Array(4) [ 2, 3, 4, 5 ]
Array [ 1 ]

Como você pode ver na saída, o primeiro elemento, neste caso, 1 é removido com sucesso do array original.

2. Método shift():

Outra maneira de remover o primeiro elemento do array é usando o método shift(). Com o método splice(), você pode adicionar ou remover qualquer elemento em qualquer índice do array, mas o método shift() é usado especificamente para remover o elemento no índice 0 apenas. Ele remove o primeiro elemento (elemento presente no índice 0) e move os elementos restantes do array para a esquerda.

Este método também retorna o elemento que foi removido do array. Aqui, também criamos uma variável firstElement que armazenará o primeiro elemento removido do array.

let array = [1, 2, 3, 4, 5];
let firstElement = array.shift();
console.log(array, firstElement);

Finalmente, imprimiremos as variáveis ​​array e firstElement.

Produção:

Array(4) [ 2, 3, 4, 5 ]
1

Remova o primeiro elemento do array mantendo a matriz original inalterada em JavaScript

1. Método filter():

Vimos os métodos que mudam ou modificam o array original; vamos ver agora alguns métodos que mantêm o array original como está e armazenam os resultados da operação em um novo array. Um desses métodos é o método filter().

O método filter() funciona com base na condição. E com base no fato de a condição ser verdadeira ou falsa, ele decide se adiciona os elementos em uma nova matriz ou não.

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.filter((element, index) => index > 0);
console.log(array_1, array_2);

O método filter() recebe uma função de retorno de chamada (função de seta) como argumento. Essa função de retorno de chamada é chamada em cada elemento do array. Esta função nos dará o element do array e seu index.

Como queremos remover o primeiro elemento, adicionaremos uma condição de que o índice do elemento seja maior que zero ou não (index > 0). Se isso for verdade, então apenas a função filter() irá inserir o elemento no novo array e não o contrário. Todos os outros elementos serão inseridos na nova matriz, exceto para o elemento no índice 0 (ou seja, o primeiro elemento).

Produção:

Array(5) [ 1, 2, 3, 4, 5 ]
Array(4) [ 2, 3, 4, 5 ]

2. Método slice():

O próximo método que mantém o array original é o método slice(). O método slice() corta a matriz em dois lugares. Para isso, temos que especificar o índice inicial e final. O start representa o primeiro índice de onde queremos começar a fatiar a matriz, e a divisão irá parar um elemento antes do end.

Quaisquer elementos presentes no start e end (incluindo valor inicial e parada de um elemento antes do fim) serão inseridos na nova matriz. Ambos os parâmetros são opcionais. Para obter mais informações, leia a documentação do método slice().

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.slice(1);
console.log(array_1, array_2);

Estaremos passando o parâmetro start apenas porque queremos remover o primeiro elemento do array. Não especificar o end significa que todos os elementos do array a partir do valor start serão incluídos. No nosso caso, passaremos slice(1). Isso copiará os elementos [2,3,4,5] do array original, ou seja, array_1 para array_2. No final, imprimiremos os dois arrays usando o método console.log(). A saída do código acima é mostrada abaixo.

Produção:

Array(5) [ 1, 2, 3, 4, 5 ]
Array(4) [ 2, 3, 4, 5 ]