En este capítulo vamos a ver dos características muy útiles, sobre todo si estamos metidos en el mundo, o si nuestra intención posteriormente de aprender Javascript es aprender acerca de los Frameworks o librerías reactivas como Angular, Vue o React. Los parámetros REST y el operador de propagación o Spread Operator son herramientas que utilizamos en el día a día.
Parámetros REST
Los parámetros REST son una forma de virtualmente ir agregando parámetros infinitos ya sea a una función, o bien dentro de una variable, que puede ser un array, pero no sabemos exactamente cuantos valores vamos a recibir, y posteriormente con esos valores vamos a realizar ciertas operaciones o ciertos procesos.
Para definir los parámetros únicamente hay que anteponer 3 puntos suspensivos (…) antes del nombre donde están guardados esos posibles valores infinitos.
Ejm
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Parámetros REST</title>
</head>
<body>
<h1>Parámetros REST</h1>
<script>
function sumar(a, b, ...c) {
let resultado = a + b;
c.forEach(function (n) {
resultado += n;
});
return resultado;
}
console.log(sumar(1, 2));
console.log(sumar(1, 2, 4));
console.log(sumar(1, 2, 4, 7));
</script>
</body>
</html>Operador de propagación o spread operator
El operador de propagación o spread operator, lo que hace es cuando una expresión la tengamos que expandir en situaciones donde tengamos que almacenar múltiples argumentos o elementos, lo podamos hacer. Un caso muy útil, es cuando tenemos un array con cierto número de elementos, pero en cierto momento recibimos nuevos parámetros, entonces, en vez de estar haciendo ciertas concatenaciones o push a nuestro array, lo que hacemos es agregarlo con el spread operator, El spread operator, al igual que los parámetros REST, se distinguen por anteponer los 3 puntos (…).
Ejm
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Spread Operator</title> </head> <body> <h1>Spread Operator</h1> <script> const arr1 = [1, 2, 3, 4, 5], arr2 = [5, 6, 7, 8, 9, 0]; console.log(arr1, arr2); // Crear un tercer array a partir de los dos creados usando spread operator const arr3 = [...arr1, ...arr2]; console.log(arr3); </script> </body> </html>