Diferenças entre splice e slice em JavaScript

Neste artigo você vai entender quais as diferenças entre splice e slice em JavaScript, métodos muito importantes para manipulação de arrays

Fala programador(a), beleza? Bora aprender a diferença entre os métodos slice e splice, que são utilizados para manipulação de arrays.

O nome deles é bem parecido, mas as suas operações são distintas, vamos primeiramente ver o splice

Splice

O método splice leva alguns parâmetros, o primeiro é o índice onde a remoção é iniciada

Já o segundo é a quantidade de itens que vamos remover após a aplicação da função

E ainda há um terceiro parâmetro que indica os itens que vão entrar no lugar dos elementos removidos

Veja na prática:

var a1 = [0, 1, 2, 3, 4, 5];

console.log(a1.splice(1, 3)); // [1, 2, 3]

console.log(a1); // [0, 4, 5]

var a2 = ['teste', 'teste', 'teste'];

console.log(a2.splice(1,1, 'testando')); // ['teste'];
 
console.log(a2); // ["teste", "testando", "teste"]

Lembrando que o retorno de splice são os elementos que foram removidos pelo método

E as alterações persistem no array original, ou seja, alterando o valor da variável

Slice

Já o slice não altera o array inicial, ou seja, não modifica o valor da variável

E nos retorna um array com os valores que inserimos pelos parâmetros

No slice passamos primeiramente o índice inicial e depois o índice final, quando o método para de resgatar os números

Veja alguns exemplos práticos:

var a1 = [0, 1, 2, 3, 4, 5];

console.log(a1.slice(1, 3)); // [1, 2]

console.log(a1); // [0, 1, 2, 3, 4, 5]

var a2 = ['teste1', 'teste2', 'teste3'];

console.log(a2.slice(0,1)); // ['teste1'];
 
console.log(a2); // ["teste1", "teste2", "teste3"]

Perceba que os arrays originais não são modificados, e que o retorno da função é o que foi resgatado via slice

Conclusão

Neste artigo vimos quais as diferenças entre splice e slice

O método splice remove os elementos de um array, e também retorna os elementos removidos após a aplicação do método

Já slice apenas retorna os elementos selecionados, ele não altera a estrutura original de array que aplicamos o método

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