Funciones
Las funciones son bloques de código reutilizables con un nombre. En vez de repetir la misma lógica diez veces, la encapsulas en una función y la llamas cuando la necesitas. Son la unidad básica de organización en JavaScript.
Declaración de función
La forma clásica. El nombre de la función describe qué hace:
function saludar(nombre) {
return `Hola, ${nombre}!`;
}
const resultado = saludar('Ana'); // 'Hola, Ana!'
Las funciones declaradas con function se elevan (hoisting): puedes llamarlas antes de declararlas en el código.
// Esto funciona:
const x = duplicar(5); // 10
function duplicar(n) {
return n * 2;
}
Expresión de función
La función se asigna a una variable. No se eleva — debes declararla antes de usarla:
const saludar = function(nombre) {
return `Hola, ${nombre}!`;
};
saludar('Luis'); // 'Hola, Luis!'
Arrow functions (funciones flecha)
La sintaxis moderna y más concisa. Es la forma más usada en JavaScript actual:
const saludar = (nombre) => {
return `Hola, ${nombre}!`;
};
Si el cuerpo es una sola expresión, puedes omitir las llaves y el return:
const saludar = (nombre) => `Hola, ${nombre}!`;
const duplicar = (n) => n * 2;
const sumar = (a, b) => a + b;
// Con un solo parámetro, los paréntesis son opcionales:
const doble = n => n * 2;
Parámetros y argumentos
Los parámetros son los nombres en la declaración. Los argumentos son los valores que pasas al llamarla:
function sumar(a, b) { // a y b son parámetros
return a + b;
}
sumar(3, 4); // 3 y 4 son argumentos
Valores por defecto
Si no se pasa un argumento, usa el valor por defecto:
function saludar(nombre = 'Invitado', hora = 'día') {
return `Buenos ${hora}, ${nombre}!`;
}
saludar(); // 'Buenos día, Invitado!'
saludar('Ana'); // 'Buenos día, Ana!'
saludar('Luis', 'tardes'); // 'Buenos tardes, Luis!'
Rest parameters — número variable de argumentos
function sumarTodo(...numeros) {
return numeros.reduce((total, n) => total + n, 0);
}
sumarTodo(1, 2, 3); // 6
sumarTodo(1, 2, 3, 4, 5); // 15
Return
Las funciones devuelven undefined si no tienen return. El return sale de la función inmediatamente:
function esPar(n) {
if (n % 2 === 0) return true;
return false;
console.log('esto nunca se ejecuta'); // código muerto
}
// Simplificado:
const esPar = n => n % 2 === 0;
Ámbito (scope)
Las variables declaradas dentro de una función son locales — no existen fuera:
function calcular() {
const resultado = 42;
return resultado;
}
console.log(resultado); // ReferenceError: resultado no está definida
Las funciones sí pueden acceder a variables del ámbito exterior:
const multiplicador = 3;
function triplicar(n) {
return n * multiplicador; // accede a la variable exterior
}
triplicar(5); // 15
Funciones como valores (primera clase)
En JavaScript, las funciones son ciudadanos de primera clase: se pueden asignar a variables, pasar como argumentos y devolver desde otras funciones.
Funciones como argumentos (callbacks)
function ejecutar(fn) {
fn(); // ejecuta la función que recibe
}
ejecutar(() => console.log('¡Hola desde un callback!'));
const numeros = [3, 1, 4, 1, 5, 9];
const ordenados = numeros.sort((a, b) => a - b);
// [1, 1, 3, 4, 5, 9]
Funciones que devuelven funciones
function crearMultiplicador(factor) {
return (numero) => numero * factor;
}
const triple = crearMultiplicador(3);
const cuadruple = crearMultiplicador(4);
triple(5); // 15
cuadruple(5); // 20
Cuándo usar cada tipo
| Situación | Tipo de función |
|---|---|
| Función nombrada reutilizable | Declaración function |
| Callback o función anónima | Arrow function |
| Método de objeto | Declaración o expresión (no arrow, por el this) |
| Función que devuelve función | Arrow function |
En la siguiente lección vemos los arrays: la estructura de datos más usada en JavaScript, con todos sus métodos esenciales.