Taller 11 Parte 2: Ejercicios de Funciones en JavaScript

5 Ejercicios - Parte 2/3

🟡 FUNCIONES ANÓNIMAS

EJERCICIO

Ejercicio 6.1: Función Anónima Básica

Crear y ejecutar una función anónima que calcule el área de un rectángulo.

📝 Instrucciones:

• Crea una función anónima que reciba ancho y alto como parámetros
• La función debe retornar el área (ancho * alto)
• Asigna la función a una variable llamada calcularArea
• Prueba la función con valores 5 y 8

💡 Salida Esperada:

calcularArea(5, 8) → 40
// Escribe tu código aquí

📝 Solución:

                            
// Función anónima asignada a una variable
const calcularArea = function(ancho, alto) {
    return ancho * alto;
};

// Prueba de la función
const area = calcularArea(5, 8);
console.log(`El área del rectángulo es: ${area}`); // 40

// Ejemplo adicional
console.log(calcularArea(10, 3)); // 30
                            
                        
EJERCICIO

Ejercicio 6.2: Función Anónima como Callback

Crear una función anónima como callback para procesar un array de números.

📝 Instrucciones:

• Crea un array con los números [1, 2, 3, 4, 5]
• Usa el método map() con una función anónima
• La función debe duplicar cada número
• Muestra el resultado en la consola

💡 Salida Esperada:

[2, 4, 6, 8, 10]
// Escribe tu código aquí

📝 Solución:

                            
// Array de números
const numeros = [1, 2, 3, 4, 5];

// Usar map con función anónima
const duplicados = numeros.map(function(numero) {
    return numero * 2;
});

console.log("Números originales:", numeros);
console.log("Números duplicados:", duplicados);
                            
                        

🟠 ARROW FUNCTIONS

EJERCICIO

Ejercicio 7.1: Arrow Function Básica

Convertir función tradicional a arrow function para calcular el cuadrado de un número.

📝 Instrucciones:

• Crea una arrow function llamada cuadrado
• Debe recibir un número como parámetro
• Debe retornar el número elevado al cuadrado
• Usa la sintaxis más corta posible

💡 Salida Esperada:

cuadrado(4) → 16
// Escribe tu código aquí

📝 Solución:

                            
// Arrow function - sintaxis corta
const cuadrado = num => num * num;

// Arrow function - sintaxis completa
const cuadradoCompleto = (num) => {
    return num * num;
};

// Pruebas
console.log(cuadrado(4)); // 16
console.log(cuadrado(7)); // 49
console.log(cuadradoCompleto(5)); // 25
                            
                        
EJERCICIO

Ejercicio 7.2: Arrow Functions con Arrays

Usar arrow functions con métodos de array para filtrar y transformar datos.

📝 Instrucciones:

• Crea un array de números del 1 al 10
• Usa filter() con arrow function para obtener números pares
• Usa map() con arrow function para elevar al cubo cada número par
• Combina ambas operaciones en una sola cadena

💡 Salida Esperada:

[8, 64, 216, 512, 1000]
// Escribe tu código aquí

📝 Solución:

                            
// Array de números del 1 al 10
const numeros = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// Método por pasos
const pares = numeros.filter(num => num % 2 === 0);
const cubos = pares.map(num => num ** 3);

console.log("Números originales:", numeros);
console.log("Números pares:", pares);
console.log("Cubos de pares:", cubos);

// Método encadenado
const resultado = numeros
    .filter(num => num % 2 === 0)
    .map(num => num ** 3);

console.log("Resultado encadenado:", resultado);
                            
                        

🔵 CALLBACKS

EJERCICIO

Ejercicio 8.1: Callback Simple

Crear una función que use un callback para procesar datos de manera personalizada.

📝 Instrucciones:

• Crea una función procesarNumero que reciba un número y un callback
• El callback debe ser ejecutado con el número como argumento
• Crea tres callbacks diferentes: duplicar, triplicar y elevar al cuadrado
• Prueba la función con cada callback

💡 Salida Esperada:

procesarNumero(5, duplicar) → 10
procesarNumero(5, triplicar) → 15
procesarNumero(5, cuadrado) → 25
// Escribe tu código aquí

📝 Solución:

                            
// Función principal que usa callback
function procesarNumero(numero, callback) {
    return callback(numero);
}

// Callbacks
const duplicar = (num) => num * 2;
const triplicar = (num) => num * 3;
const cuadrado = (num) => num * num;

// Pruebas
console.log(procesarNumero(5, duplicar)); // 10
console.log(procesarNumero(5, triplicar)); // 15
console.log(procesarNumero(5, cuadrado)); // 25

// Uso con función anónima
console.log(procesarNumero(8, function(n) { return n + 10; })); // 18
                            
                        
EJERCICIO

Ejercicio 8.2: Callback con Arrays

Implementar una función personalizada que emule el comportamiento de forEach.

📝 Instrucciones:

• Crea una función miForEach que reciba un array y un callback
• La función debe iterar sobre el array y ejecutar el callback en cada elemento
• El callback debe recibir: elemento, índice y array completo
• Prueba con diferentes callbacks

💡 Salida Esperada:

Elemento: a, Índice: 0
Elemento: b, Índice: 1
Elemento: c, Índice: 2
// Escribe tu código aquí

📝 Solución:

                            
// Implementación personalizada de forEach
function miForEach(array, callback) {
    for (let i = 0; i < array.length; i++) {
        callback(array[i], i, array);
    }
}

// Array de prueba
const letras = ['a', 'b', 'c'];

// Callback que muestra elemento e índice
miForEach(letras, (elemento, indice) => {
    console.log(`Elemento: ${elemento}, Índice: ${indice}`);
});

// Callback que muestra todo
miForEach(letras, (elemento, indice, array) => {
    console.log(`${elemento} en posición ${indice} de [${array}]`);
});
                            
                        

🟣 FUNCIONES DE ORDEN SUPERIOR

EJERCICIO

Ejercicio 9.1: Función que Retorna Función

Crear una función de orden superior que genere multiplicadores personalizados.

📝 Instrucciones:

• Crea una función crearMultiplicador que reciba un factor
• Debe retornar una nueva función que multiplique por ese factor
• Crea multiplicadores para 2, 3 y 10
• Prueba cada multiplicador con diferentes números

💡 Salida Esperada:

multiplicarPor2(5) → 10
multiplicarPor3(4) → 12
multiplicarPor10(7) → 70
// Escribe tu código aquí

📝 Solución:

                            
// Función de orden superior que retorna una función
function crearMultiplicador(factor) {
    return function(numero) {
        return numero * factor;
    };
}

// Crear multiplicadores específicos
const multiplicarPor2 = crearMultiplicador(2);
const multiplicarPor3 = crearMultiplicador(3);
const multiplicarPor10 = crearMultiplicador(10);

// Pruebas
console.log(multiplicarPor2(5)); // 10
console.log(multiplicarPor3(4)); // 12
console.log(multiplicarPor10(7)); // 70

// Versión con arrow function
const crearMultiplicadorArrow = factor => numero => numero * factor;
const multiplicarPor5 = crearMultiplicadorArrow(5);
console.log(multiplicarPor5(6)); // 30
                            
                        
EJERCICIO

Ejercicio 9.2: Decorador de Funciones

Crear un decorador que añada funcionalidad a otras funciones.

📝 Instrucciones:

• Crea una función conLog que reciba una función como parámetro
• Debe retornar una nueva función que registre la entrada y salida
• La nueva función debe ejecutar la función original y mostrar logs
• Prueba con una función de suma

💡 Salida Esperada:

Ejecutando función con argumentos: [3, 4]
Resultado: 7
// Escribe tu código aquí

📝 Solución:

                            
// Decorador que añade logging a cualquier función
function conLog(func) {
    return function(...args) {
        console.log(`Ejecutando función con argumentos: [${args}]`);
        const resultado = func(...args);
        console.log(`Resultado: ${resultado}`);
        return resultado;
    };
}

// Función simple de suma
function sumar(a, b) {
    return a + b;
}

// Aplicar el decorador
const sumarConLog = conLog(sumar);

// Pruebas
sumarConLog(3, 4); // Logs + retorna 7
sumarConLog(10, 5); // Logs + retorna 15

// También funciona con arrow functions
const multiplicar = (a, b) => a * b;
const multiplicarConLog = conLog(multiplicar);
multiplicarConLog(3, 7); // Logs + retorna 21
                            
                        

🔴 CLOSURES

EJERCICIO

Ejercicio 10.1: Contador con Closure

Crear un contador privado usando closures para encapsular la variable.

📝 Instrucciones:

• Crea una función crearContador que retorne un objeto
• El objeto debe tener métodos: incrementar, decrementar, obtenerValor
• La variable contador debe ser privada (no accesible desde fuera)
• Crea múltiples contadores independientes

💡 Salida Esperada:

contador1.obtenerValor() → 0
contador1.incrementar() → 1
contador2.obtenerValor() → 0 (independiente)
// Escribe tu código aquí

📝 Solución:

                            
// Función que crea un contador con closure
function crearContador(valorInicial = 0) {
    let contador = valorInicial; // Variable privada

    return {
        incrementar: function() {
            contador++;
            return contador;
        },
        decrementar: function() {
            contador--;
            return contador;
        },
        obtenerValor: function() {
            return contador;
        },
        reset: function() {
            contador = valorInicial;
            return contador;
        }
    };
}

// Crear contadores independientes
const contador1 = crearContador();
const contador2 = crearContador(10);

// Pruebas
console.log(contador1.obtenerValor()); // 0
console.log(contador1.incrementar()); // 1
console.log(contador1.incrementar()); // 2

console.log(contador2.obtenerValor()); // 10
console.log(contador2.decrementar()); // 9

// Los contadores son independientes
console.log(contador1.obtenerValor()); // 2 (sin cambios)
                            
                        
EJERCICIO

Ejercicio 10.2: Módulo con Closures

Crear un módulo de gestión de cuentas bancarias usando closures para datos privados.

📝 Instrucciones:

• Crea una función crearCuenta que reciba saldo inicial
• Retorna un objeto con métodos: depositar, retirar, consultarSaldo, obtenerHistorial
• Saldo e historial deben ser privados
• Validar que no se pueda retirar más del saldo disponible

💡 Salida Esperada:

cuenta.consultarSaldo() → "Saldo actual: $1000"
cuenta.depositar(500) → "Depósito exitoso"
cuenta.retirar(2000) → "Fondos insuficientes"
// Escribe tu código aquí

📝 Solución:

                            
// Módulo de cuenta bancaria con closures
function crearCuenta(saldoInicial = 0) {
    let saldo = saldoInicial;
    let historial = [];

    // Función privada para registrar transacciones
    function registrarTransaccion(tipo, monto, saldoAnterior) {
        historial.push({
            fecha: new Date().toLocaleString(),
            tipo: tipo,
            monto: monto,
            saldoAnterior: saldoAnterior,
            saldoNuevo: saldo
        });
    }

    return {
        depositar: function(monto) {
            if (monto <= 0) {
                return "El monto debe ser positivo";
            }
            const saldoAnterior = saldo;
            saldo += monto;
            registrarTransaccion("Depósito", monto, saldoAnterior);
            return `Depósito exitoso. Nuevo saldo: $${saldo}`;
        },

        retirar: function(monto) {
            if (monto <= 0) {
                return "El monto debe ser positivo";
            }
            if (monto > saldo) {
                return "Fondos insuficientes";
            }
            const saldoAnterior = saldo;
            saldo -= monto;
            registrarTransaccion("Retiro", monto, saldoAnterior);
            return `Retiro exitoso. Nuevo saldo: $${saldo}`;
        },

        consultarSaldo: function() {
            return `Saldo actual: $${saldo}`;
        },

        obtenerHistorial: function() {
            return [...historial]; // Retorna copia del historial
        }
    };
}

// Crear cuenta
const miCuenta = crearCuenta(1000);

// Pruebas
console.log(miCuenta.consultarSaldo()); // Saldo actual: $1000
console.log(miCuenta.depositar(500)); // Depósito exitoso...
console.log(miCuenta.retirar(200)); // Retiro exitoso...
console.log(miCuenta.retirar(2000)); // Fondos insuficientes
console.log(miCuenta.consultarSaldo()); // Saldo actual: $1300

// Ver historial
console.log("Historial de transacciones:");
console.log(miCuenta.obtenerHistorial());