Saltar al contenidoPedro Farbo
Lección 12 / 1645 min

Funciones: Código Reutilizable

Funciones: Código Reutilizable

¡Las funciones son bloques de código reutilizables. Son fundamentales!

¿Por Qué Usar Funciones?

Sin función:

javascript
console.log("¡Hola, María!");console.log("¡Hola, Juan!");console.log("¡Hola, Ana!");

Con función:

javascript
function saludar(nombre) {    console.log(`¡Hola, ${nombre}!`);} saludar("María");saludar("Juan");saludar("Ana");

Ventajas:

  • Reutilización - escribe una vez, usa muchas veces
  • Organización - código más legible
  • Mantenimiento - cambia en un solo lugar

Creando Funciones

Declaración de Función

javascript
function saludar() {    console.log("¡Hola!");} saludar(); // llamando la función

Función con Parámetros

javascript
function saludar(nombre) {    console.log(`¡Hola, ${nombre}!`);} saludar("María"); // "¡Hola, María!"saludar("Juan");  // "¡Hola, Juan!"

Función con Return

javascript
function sumar(a, b) {    return a + b;} const resultado = sumar(5, 3);console.log(resultado); // 8

return envía el valor de vuelta y termina la función.

Expresión de Función

javascript
const saludar = function(nombre) {    return `¡Hola, ${nombre}!`;}; console.log(saludar("María"));

Arrow Function (Moderno)

javascript
// Con llaves (múltiples líneas)const saludar = (nombre) => {    return `¡Hola, ${nombre}!`;}; // Simplificado (una línea)const saludar = (nombre) => `¡Hola, ${nombre}!`; // Un parámetro (sin paréntesis necesarios)const doble = n => n * 2; // Sin parámetrosconst decirHola = () => "¡Hola!";

Parámetros por Defecto

javascript
function saludar(nombre = "visitante") {    console.log(`¡Hola, ${nombre}!`);} saludar();        // "¡Hola, visitante!"saludar("María"); // "¡Hola, María!"

Múltiples Parámetros

javascript
function crearPerfil(nombre, edad, ciudad) {    return {        nombre: nombre,        edad: edad,        ciudad: ciudad    };} const perfil = crearPerfil("Juan", 25, "Madrid");

Scope (Alcance)

Dónde existen las variables:

javascript
const global = "Existo en todos lados"; function test() {    const local = "Solo existo aquí dentro";    console.log(global); // ✅ Funciona    console.log(local);  // ✅ Funciona} console.log(global); // ✅ Funcionaconsole.log(local);  // ❌ ¡Error!

Funciones Llamando Funciones

javascript
function cuadrado(n) {    return n * n;} function sumaCuadrados(a, b) {    return cuadrado(a) + cuadrado(b);} console.log(sumaCuadrados(3, 4)); // 9 + 16 = 25

Funciones de Orden Superior

Funciones que reciben otras funciones:

javascript
const numeros = [1, 2, 3, 4, 5]; // map - transforma cada elementoconst doblados = numeros.map(n => n * 2);// [2, 4, 6, 8, 10] // filter - filtra elementosconst pares = numeros.filter(n => n % 2 === 0);// [2, 4] // find - encuentra primer coincidenciaconst mayorQue3 = numeros.find(n => n > 3);// 4 // reduce - acumulaconst suma = numeros.reduce((acc, n) => acc + n, 0);// 15

Ejercicio Práctico: Calculadora

javascript
function sumar(a, b) {    return a + b;} function restar(a, b) {    return a - b;} function multiplicar(a, b) {    return a * b;} function dividir(a, b) {    if (b === 0) {        return "Error: no se puede dividir por cero";    }    return a / b;} function calcular(a, operador, b) {    switch (operador) {        case "+": return sumar(a, b);        case "-": return restar(a, b);        case "*": return multiplicar(a, b);        case "/": return dividir(a, b);        default: return "Operador inválido";    }} // Usoconsole.log(calcular(10, "+", 5));  // 15console.log(calcular(10, "-", 3));  // 7console.log(calcular(4, "*", 3));   // 12console.log(calcular(20, "/", 4));  // 5

Tips

  1. Nombres descriptivos: calcularPromedio es mejor que calc
  2. Una cosa por función: si el nombre tiene "y", tal vez dividir
  3. Pocos parámetros: idealmente hasta 3
  4. Siempre retornar: aunque sea un mensaje

Resumen

  • ✅ Las funciones organizan y reutilizan código
  • ✅ Los parámetros las hacen flexibles
  • return envía el valor de vuelta
  • ✅ Las arrow functions son modernas y concisas
  • ✅ El scope controla dónde existen las variables

¡En la próxima lección, aprenderemos arrays y objetos! 🚀

¿Te gustó el contenido? ¡Tu contribución ayuda a mantener todo online y gratuito!

PIX:0737160d-e98f-4a65-8392-5dba70e7ff3e