13 - Parámetros

¿Qué es parámetro rest (rest parameter)?

Es un “parámetro especial” de nuestra función que nos permite añadir una cantidad variable de parámetros en forma de Array. Se indica con ... seguido del nombre del parámetro rest.


¿Qué es parámetro spread (spread parameter)?

Es similar al parámetro rest pero el parámetro especial (el cual debe ser un Array) lo añadimos en la llamada a la función en lugar de su declaración.


Estructura inicial

En nuestra carpeta de proyecto crearemos la siguiente estructura:

/
├── js/
│   └── 13-parametros.js
└── index.html

Y un código sencillo para nuestro HTML:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="./js/13-parametros.js"></script>
    <title>13 - Parámetros Rest y Spread</title>
</head>
<body>
    <h1>Temario de JavaScript</h1>
</body>
</html>

Declarando una función con parámetros

/* rest parameter */
function nombreFunción(parámetro1, ...restoDeParámetros) {
    // Código de la función
}

nombreFunción(parámetro1, parámetro2, parámetro3)

/* spread parameter */
function nombreFunción2(parámetro1, parámetro2) {
    // Código de la función
}

let params = [parámetro1, parámetro2]
nombreFunción2(...params)

Ejemplo de funciines con parámetros

function mostrarHobbies(nombre, hobbiePrincipal, ...otrosHobbies) {
    console.log(
        "Hola, me llamo " + nombre + " y me gusta " + 
        hobbiePrincipal + ". Además de eso, también me gusta: " + 
        otrosHobbies + "."
    )
}

mostrarHobbies("José", "cocinar", "escalar", "nadar", "dormir")
//Hola, me llamo José y me gusta cocinar. Además de eso, también me gusta: escalar,nadar,dormir.

function nombreEdad(nombre, apellidos, edad) {
    console.log("Soy " + nombre + " " + apellidos + ". Tengo " + edad + " años.")
}

let datos = ["Luisa", "Bajo Tena", 19]
nombreEdad(...datos) //Soy Luisa Bajo Tena. Tengo 19 años.