Ejemplos de la función slice en JavaScript

Ahora voy a explicarte como puedes sacar provecho de la función slice en JS, mediante algunos ejemplos muy sencillos.

¿Como se usa la función slice?

Voy a comenzar explicando que es esta función y como se usa, para luego comenzar con los ejemplos

La función slice parte un arreglo y regresa algunos elementos del arreglo, todo esto sin modificar el arreglo original. Trabaja como la función substring, pero en los elementos de un arreglo. La sintaxis es esta:

VariableArray.slice([inicio [, fin]])

El parámetro inicio indica desde que elemento necesitamos incluir en el nuevo arreglo, tomando en cuenta que el primer elemento corresponde al número 0 y el segundo elemento corresponde al número 1.

El valor fin indica hasta que elemento necesitamos incluir, este sigue las mismas reglas que el parámetro inicio. Si lo omitimos, entonces regresa todos los elementos restantes (que están después del indicado en el parámetro inicio)

Ejemplos de slice en JS

Ahora veamos algunos ejemplos de la función slice

Crear un array con los primeros 2 elementos de otro array.

//Declarar array
let mascotas = ['Tom', 'Ginger', 'Hank'];
let gatos = mascotas.slice(0,2);
console.log(gatos); // muestra  ['Tom', 'Ginger']

En el ejemplo anterior se obtiene un arreglo con los elementos Tom y Ginger. Al inicio escribí que las posiciones de los elementos inician en cero, entonces quizá te preguntas por que no regresa 3 elementos si el número 2 corresponde al tercer elemento de un arreglo. Esto pasa por que el parámetro fin de la función slice, realmente indica el elemento que ya no deseas, entonces en el nuevo array estarán los elementos hasta la posición fin - 1

Eliminar el último valor del arreglo

//Declarar array
let mascotas = ['Tom', 'Ginger', 'Hank'];
//Eliminar último elemento
mascotas = mascotas.slice(0,-1)
//Mostrar resultado
console.log('Mascotas', mascotas); //Muestra Tom y Ginger

En este ejemplo hay dos cosas importantes que observar: sabemos que la función slice regresa un nuevo array y no afecta al array original, pero si queremos que se comporte de forma diferente y sí modifique el array, entonces podemos asignar el resultado a la variable del array, tal y como lo hice en este ejemplo.

El otro punto importante es que el parámetro fin tiene un valor negativo, cuando usamos un valor negativo, estamos diciendo que cuente desde el final del arreglo hacia la izquierda. Por ejemplo -1 hace referencia al último elemento, -2 hace referencia al segundo elemento de izquierda a derecha y así sucesivamente.