Método slice en JavaScript

Autor: | Última modificación: 28 de diciembre de 2023 | Tiempo de Lectura: 3 minutos
Temas en este post:

Algunos de nuestros reconocimientos:

Premios KeepCoding

Los arrays son un tipo de objeto que nos permite crear listados de elementos. Al ser un tipo de objeto o comportarse como tal, tienen a disposición diversos métodos que nos permiten manipular su contenido. En este post, te enseñaremos cómo funciona el método slice en JavaScript (slice JS), uno de los métodos disponibles para manipular el contenido de un array.

¿Qué es el método slice en JavaScript?

El método slice en JavaScript (slice JS) es una de las funciones globales disponibles para manipular los elementos de un array. El propósito de este método es, como su nombre indica, cortar un trozo del array o cortar array javascript. Es decir que con slice podemos definir una sección del array que queremos mantener, eliminando los elementos restantes.

Así como con otros métodos, como son map o filter, el método slice en JavaScript nos devuelve un nuevo array. Es decir, no altera el largo del array original.

Para utilizar el método slice en JavaScript, debemos acceder a esta funcion slice javascript con el comando array.slice, al igual que con los demás métodos, e insertar las características del trozo dentro de sus paréntesis. Para esta funcion slice en JavaScript en particular, deberemos insertar los parámetros de inicio y final, que definirán los límites del trozo que queremos seleccionar. A continuación, te explicamos cómo se definen estos parámetros.

Inicio

Los parámetros de inicio y final del método slice en JavaScript (slice JS) definen los límites del trozo a «cortar» a partir del índice del array. Por ello, te invitamos a leer nuestro post sobre cómo funciona el índice de un array en JavaScript para entender mejor este concepto para slice en JavaScript . Allí te explicamos que los elementos de un array tienen un índice que define su posición dentro del objeto. Este índice se cuenta desde el número 0 y sube de valor de izquierda a derecha. Es decir, el primer valor tiene un índice de 0.

Entonces, para definir el parámetro de inicio en slice en JavaScript usaremos un valor numérico basado en la posición del elemento. Si no definimos este parámetro, el valor por defecto será 0. Esto es, el trozo del array empezará en su inicio.

Aunque los índices normalmente tienen un valor positivo, podemos insertar un valor negativo en este parámetro. El programa interpretará este valor como un desplazamiento desde el final del array. O sea que si insertamos el valor -4, el inicio será el cuarto elemento antes del final del array.

Si el valor que insertamos es mayor a la propiedad length del array, obtendremos un array vacío.

Fin

Al igual que el inicio, el parámetro de fin utiliza un valor numérico para describir la posición que marca el límite final del trozo. Ten presente que el elemento que esté en esta posición no será incluido en el nuevo array. Es decir, este valor funciona como un límite externo. Además, si omitimos este valor o si insertamos un valor mayor a la propiedad length del array en cuestión, el trozo tomará el final del objeto como el límite fin. Todas las demás opciones funcionan igual que en el parámetro inicio del slice en JavaScript .

A continuación, te mostramos un ejemplo de slice JS:

var colores = ['verde', 'azul', 'amarillo', 'rojo', 'negro']
var coloresPrimarios = colores.slice (1, 4); 
// coloresPrimarios contiene ['azul', 'amarillo', 'rojo']

¿Qué sigue?

Tras leer este post, sabes exactamente cómo funciona el método slice en JavaScript, pero ¡todavía queda mucho por aprender si quieres dominar este lenguaje de programación! Por ello, te invitamos a seguir aprendiendo con nosotros en nuestro Desarrollo Web Full Stack Bootcamp, donde aprenderás a dominar JavaScript y otros lenguajes, como CSS y HTML, entre muchas otras cosas. ¡Te esperamos!

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado