Spread operator en JavaScript

Qué es y como funciona el spread operator en JavaScript.

spread-operator-javascript

Desde la versión ES6, en JavaScript existe un operador llamado spread operator denotado por tres puntos .... Principalmente se usa para expandir objetos iterables como Arrays en elementos individuales y nos permite fusionar, copiar o passar elementos por parámetro en funciones sin tener que iterar a través de ellos. Veamos las funcionalidades principales.

Concatenar Arrays

Combinar múltiples arrays:

const coleccion1 = [1, 2, 3];
const coleccion2 = [4, 5, 6];
const concatenatedArr = [...coleccion1, ...coleccion2];
console.log(concatenatedArr) // Resultado: [1, 2, 3, 4, 5, 6]

Copiar estructuras de datos

Para crear una copia nueva de un Array y asegurar que si manipulamos la copia no afecta a la original:

const original = [1, 2, 3];
const copia = [...original];

Pasar argumentos a funciones

Facilita pasar argumentos a funciones para no tener que pasarlos uno a uno:

const numeros = [15, 5, 7, 2, 9];
const minimo = Math.min(...numeros);
console.log(minimo) // 2

Fusionar objetos

También podemos fusionar objetos:

const obj1 = {a: 1, b: 2};
const obj2 = {c: 3, d: 4};
const combinado = {...obj1, ...obj2};
console.log(combinado) // {a: 1, b: 2, c: 3, d: 4}

Conclusión

El spread operator es un operador muy potente que facilita y simplifica la manipulación de Arrays y objetos. En este tutorial hemos visto las formas más habituales en las que podemos darle uso.