Como Usar El Operador De Propagación

Uno de las características que fue introducida en ES6 es el operador de propagación que se utiliza para “propagar” una estructura de datos dentro de otra. Es la forma mejorada de la función apply.

Supongamos que tenemos la siguiente función y arreglo:

var parametros = [1, 2, 3]
function fn(x, y, z) {
  // hace cosas
}

Normalmente cuando queríamos aplicar los parámetros en el arreglo, usábamos la función apply así:

fn.apply(null, parametros);

Pero ahora con el operador de propagación es posible hacer lo siguiente:

fn(...parametros)

Lo cual desempaca los elementos del arreglo y los pasa individualmente a los argumentos de la función en cualquier combinación. Es posible también combinarlo con mas parámetros individuales.

fn(a, b, c, d, e, f) {
  // hace cosas
}
var parametros = [0, 1]
fn(-1, ...parametros, 2, 3, 4)

De la misma manera puede ser usado en arreglos literales para añadir elementos sin tener que iterar varias veces, y dejando atrás aquello de splice, push o concat.

var partes = ['hombros', 'rodillas'];
var cuerpo = ['cabeza', ...partes, 'tobillos'];
// cabeza, hombros, rodillas, tobillos

También podemos usarlo para hacer el método push mas eficiente en términos de lineas de código, lo que antes se escribía asi:

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

Array.prototype.push.apply(arr1, arr2);

Ahora puede ser escrito así:

var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);

Finalmente hay que hacer la salvedad de que el operador de propagación solo funciona con elementos que son iterables (Arrays). Por lo que si pasas un objeto obtendrás una excepción que indica que lo que estas usando no es iterable.