4.1 Parámetros de funciones
Los parámetros de funciones en JavaScript permiten pasar valores a las funciones para su procesamiento. Esto hace que las funciones sean más flexibles y adaptables. En este tema, vamos a ver los aspectos básicos de trabajar con parámetros de funciones en JavaScript, excluyendo parámetros por defecto y parámetros rest.
Los parámetros se indican entre paréntesis después del nombre de la función. Al llamar a la función, los valores de estos parámetros se pasan a las variables correspondientes dentro de la función.
Ejemplo:
En la función greet()
se definen dos parámetros: name
y age
. Al llamar a la función,
los valores Alice
y 30
se pasan a estos parámetros.
function greet(name, age) {
return `Hello, ${name}! You are ${age} years old.`;
}
console.log(greet('Alice', 30)); // "Hello, Alice! You are 30 years old."
Manejo de parámetros indefinidos
Si un parámetro no se pasa al llamar a la función, su valor será undefined
. Esto puede llevar a errores,
si se realizan operaciones con dicho parámetro que no soportan undefined
.
Ejemplo:
En la función greet()
se verifica si se pasó el parámetro name
. Si no, se usa la cadena Guest
.
function greet(name) {
if (name === undefined) {
return 'Hello, Guest!';
}
return `Hello, ${name}!`;
}
console.log(greet()); // "Hello, Guest!"
console.log(greet('Bob')); // "Hello, Bob!"
4.2 Parámetros por defecto
Los parámetros por defecto permiten establecer valores que se utilizarán si un argumento no se pasa al llamar
la función o se pasa como undefined
. Esto es especialmente útil para crear funciones con parámetros opcionales.
Sintaxis:
function name (arg1 = value1, arg2 = value2) {
// function body
}
Ejemplo 1: Función simple con parámetros por defecto
En este ejemplo, la función greet()
tiene un parámetro name con valor por defecto Guest
. Si no se pasa un argumento, se usará el valor por defecto.
function greet(name = 'Guest') {
return `Hello, ${name}!`;
}
console.log(greet('Alice')); // Mostrará: Hello, Alice!
console.log(greet()); // Mostrará: Hello, Guest!
Ejemplo 2: Parámetros por defecto con expresiones
En este ejemplo, el parámetro tax
por defecto se calcula como el 20% de price
, si no se pasa otro argumento.
function calculatePrice(price, tax = price * 0.2) {
return price + tax;
}
console.log(calculatePrice(100)); // Mostrará: 120
console.log(calculatePrice(100, 15)); // Mostrará: 115
Ejemplo 3: Parámetros por defecto dependen de otros parámetros
En este ejemplo, los parámetros por defecto permiten crear un usuario con roles y estados predefinidos.
function createUser(name, role = 'user', isActive = true) {
return { name, role, isActive };
}
console.log(createUser('Alice')); // Mostrará: { name: 'Alice', role: 'user', isActive: true }
console.log(createUser('Bob', 'admin')); // Mostrará: { name: 'Bob', role: 'admin', isActive: true }
console.log(createUser('Charlie', 'moderator', false)); // Mostrará: { name: 'Charlie', role: 'moderator', isActive: false }
4.3 Parámetros rest
Los parámetros rest permiten que la función acepte cualquier cantidad de argumentos y los reúna en un array. Esto es útil para crear funciones que puedan trabajar con un número arbitrario de argumentos.
Sintaxis:
function name (arg1, arg2, ...argArray) {
// function body
}
Ejemplo 1: Sumar todos los argumentos pasados
En este ejemplo, la función sumAll()
utiliza parámetros rest para sumar todos los argumentos pasados.
function sumAll(...numbers) {
return numbers.reduce((sum, num) => sum + num, 0);
}
console.log(sumAll(1, 2, 3)); // Mostrará: 6
console.log(sumAll(4, 5, 6, 7, 8)); // Mostrará: 30
Ejemplo 2: Función con parámetros fijos y rest
En este ejemplo, la función showItems()
acepta un parámetro fijo firstItem
y un número indefinido
de argumentos restantes, recogidos en un array otherItems
.
function showItems(firstItem, ...otherItems) {
console.log(`Primer elemento: ${firstItem}`);
console.log(`Otros elementos: ${otherItems.join(', ')}`);
}
showItems('apple', 'banana', 'cherry', 'date');
// Mostrará:
// Primer elemento: apple
// Otros elementos: banana, cherry, date
Ejemplo 3: Función con argumentos dinámicos
En este ejemplo, la función createMessage()
acepta el primer argumento messageType
y reúne todos
los demás parámetros en un array messages
para crear un mensaje.
function createMessage(messageType, ...messages) {
return `[${messageType.toUpperCase()}]: ${messages.join(' ')}`;
}
console.log(createMessage('info', 'This', 'is', 'an', 'informational', 'message'));
// Mostrará: [INFO]: This is an informational message
console.log(createMessage('error', 'An', 'error', 'occurred'));
// Mostrará: [ERROR]: An error occurred
GO TO FULL VERSION