Funciones en JavaScript: declaración, flecha y parámetros
Actualizado el 29 de septiembre de 2026
Una función agrupa código con un nombre para poder usarlo muchas veces y separar un problema en partes. En JavaScript las funciones además son valores: se pueden guardar en variables, pasar a otras funciones y devolver, y eso está en la base de casi todo el código moderno del lenguaje.
En esta guía vas a ver las tres formas de escribir una función, cómo funcionan los parámetros (incluidos los opcionales) y los errores típicos con las funciones flecha.
Tres formas de escribir una función
// 1. Declaración
function area(ancho, alto) {
return ancho * alto;
}
// 2. Expresión: una función guardada en una variable
const area2 = function (ancho, alto) {
return ancho * alto;
};
// 3. Función flecha
const area3 = (ancho, alto) => ancho * alto;
area(3, 4); // 12 (las tres dan lo mismo)Las funciones flecha son la forma más corta: si el cuerpo es una sola expresión, se escribe sin llaves y sin return, y el valor se devuelve solo. Se usan muchísimo para funciones pequeñas que se pasan a otras, como en map o filter.
Una diferencia práctica: las declaraciones se pueden llamar antes de la línea donde están escritas (JavaScript las "sube" al inicio), pero una función guardada en una const no existe hasta esa línea.
return
return entrega un valor y termina la función. Una función sin return devuelve undefined. Es la diferencia entre calcular algo y solo mostrarlo: console.log imprime, pero quien llamó a la función no recibe nada.
Parámetros por defecto
function saludar(nombre, saludo = "Hola") {
return `${saludo}, ${nombre}`;
}
saludar("Ana"); // 'Hola, Ana'
saludar("Ana", "Buenos días"); // 'Buenos días, Ana'
saludar(); // 'Hola, undefined'JavaScript no exige pasar todos los argumentos: los que faltan valen undefined, sin error. Un valor por defecto se aplica justamente cuando el argumento es undefined. Puede incluso usar parámetros anteriores: function area(ancho, alto = ancho).
Parámetros rest: cualquier cantidad de argumentos
function sumarTodos(...numeros) {
let total = 0;
for (const n of numeros) total += n;
return total;
}
sumarTodos(1, 2, 3); // 6
sumarTodos(); // 0Los tres puntos antes del último parámetro reúnen todos los argumentos restantes en un array. El mismo símbolo usado al llamar hace lo contrario, repartir un array en argumentos: Math.max(...[4, 9, 1]) es 9.
Devolver varios valores
Una función devuelve un solo valor, pero ese valor puede ser un array o un objeto, que se desarma al recibirlo: const [mayor, menor] = maxYMin(numeros). La desestructuración se explica en la guía de objetos.
Errores comunes
Función flecha con llaves y sin return
const doble = (x) => { x * 2; };
doble(4); // undefined
const doble2 = (x) => x * 2;
doble2(4); // 8Con llaves, la función flecha es un bloque normal y necesita return. Sin llaves, devuelve la expresión.
Devolver un objeto desde una función flecha
const crear = (nombre) => { nombre: nombre };
crear("Ana"); // undefined
const crear2 = (nombre) => ({ nombre: nombre });
crear2("Ana"); // { nombre: 'Ana' }Las llaves se interpretan como el cuerpo de la función, no como un objeto. Para devolver un objeto literal, envuélvelo en paréntesis.
Argumentos que faltan
sumar(1) con function sumar(a, b) { return a + b; } devuelve NaN, porque b es undefined. JavaScript tampoco reclama si sobran argumentos: se ignoran. Si una función necesita un valor, dale uno por defecto o valida la entrada.
Llamar una función flecha antes de definirla
Con const tarde = (x) => x;, llamar tarde(2) en una línea anterior lanza ReferenceError: Cannot access 'tarde' before initialization. Solo las declaraciones con function se pueden usar antes.
Ejercicios resueltos
Intenta resolver cada ejercicio antes de abrir la solución: equivocarse y corregir es la parte que más enseña.
1.Área de un rectángulo o un cuadrado
Escribe una función areaRectangulo(ancho, alto) que devuelva el área. Si no se pasa el alto, se trata de un cuadrado.
areaRectangulo(3, 4)→12areaRectangulo(5)→25
function areaRectangulo(ancho, alto) {
// ...
}Ver soluciónOcultar solución
function areaRectangulo(ancho, alto = ancho) {
return ancho * alto;
}Un parámetro por defecto puede usar los parámetros que están antes que él. Cuando no se pasa alto, toma el valor de ancho. Sin esto, alto sería undefined y el resultado, NaN.
2.Mayor y menor de un array
Escribe una función maxYMin(numeros) que devuelva un array [mayor, menor] para un array no vacío, sin usar Math.max ni Math.min.
maxYMin([4, 9, 1, 7])→[9, 1]maxYMin([-2, -8, -1])→[-1, -8]
function maxYMin(numeros) {
// ...
}Ver soluciónOcultar solución
function maxYMin(numeros) {
let mayor = numeros[0];
let menor = numeros[0];
for (const n of numeros) {
if (n > mayor) mayor = n;
if (n < menor) menor = n;
}
return [mayor, menor];
}Se parte con el primer elemento y no con 0: con puros negativos, partir en 0 daría un mayor que no está en el array. Para devolver dos valores se devuelve un array, que quien llama puede desarmar: const [mayor, menor] = maxYMin(datos).
Con las funciones del lenguaje sería [Math.max(...numeros), Math.min(...numeros)]. Cuidado con un array vacío: Math.max() sin argumentos devuelve -Infinity.
3.Sumar cualquier cantidad de números
Escribe una función sumarTodos que reciba cualquier cantidad de números como argumentos separados y devuelva su suma.
sumarTodos(1, 2, 3)→6sumarTodos(5)→5sumarTodos()→0
function sumarTodos(/* ... */) {
// ...
}Ver soluciónOcultar solución
function sumarTodos(...numeros) {
let total = 0;
for (const n of numeros) {
total += n;
}
return total;
}...numeros reúne todos los argumentos en un array, que después se recorre como cualquier otro. Sin argumentos, el array está vacío y se devuelve el 0 inicial. Con reduce también cabe en una línea: numeros.reduce((acumulado, n) => acumulado + n, 0).