🎙️ Introducción
¡Hola! Bienvenido o bienvenida al Módulo 4 del curso de JavaScript desde cero.
Hoy vamos a aprender uno de los pilares de cualquier lenguaje de programación: las funciones.
Con las funciones vamos a poder organizar nuestro código, reutilizar instrucciones, y evitar repetirnos.
Vamos paso a paso.
🧠 ¿Qué son y para qué sirven?
Una función es un bloque de código que podemos usar una y otra vez.
Nos sirve para:
- Dividir el código en partes más pequeñas.
- Reutilizar lógica.
- Hacer el código más claro y mantenible.
Por ejemplo, imaginate que querés mostrar un saludo varias veces. En vez de copiar el
console.log("Hola")
muchas veces, lo ponés dentro de una función.
📝 Declaración y ejecución
Para declarar una función, usamos la palabra
function
, le damos un nombre y escribimos el bloque de código entre llaves{}
.
function saludar() {
console.log("¡Hola desde una función!");
}
Pero eso solo la declara. Para ejecutarla, hay que llamarla:
saludar(); // Esto muestra el mensaje
Cada vez que llamemos a
saludar()
, se va a ejecutar ese bloque de código.
🧾 Parámetros, argumentos y valores de retorno
Una función puede recibir parámetros, que son como variables internas que le podemos pasar para que use.
function saludar(nombre) {
console.log("Hola, " + nombre);
}
saludar("Ezequiel");
saludar("Ana");
En este caso,
nombre
es un parámetro."Ezequiel"
y"Ana"
son los argumentos que le pasamos.
También podemos hacer que una función nos devuelva un valor con la palabra
return
.
function sumar(a, b) {
return a + b;
}
let resultado = sumar(3, 5);
console.log(resultado); // Muestra 8
Una función puede hacer cosas (como mostrar algo) o puede devolver un valor que después usamos donde queramos.
⚡ Funciones flecha (=>
)
Hay otra forma de escribir funciones que es más corta y moderna: las funciones flecha o arrow functions.
const saludar = (nombre) => {
console.log("Hola, " + nombre);
};
Si la función es muy cortita, incluso podemos hacer esto:
const sumar = (a, b) => a + b;
Esto es exactamente igual que:
function sumar(a, b) {
return a + b;
}
Pero con una sintaxis más compacta.
Las arrow functions son muy comunes en JavaScript moderno, sobre todo cuando trabajamos con arrays o funciones como callbacks.
🧭 Scope y hoisting
📍 Scope
El scope es el alcance o contexto donde una variable existe.
Una variable declarada dentro de una función solo existe dentro de esa función.
function ejemplo() {
let mensaje = "Hola";
console.log(mensaje); // Funciona
}
console.log(mensaje); // Error: mensaje no está definida fuera
Eso evita conflictos y hace que el código sea más seguro y ordenado.
🔝 Hoisting
En JavaScript, las declaraciones de funciones se “elevan” al principio del código. Esto se llama hoisting.
saludar(); // Esto funciona, aunque esté arriba
function saludar() {
console.log("Hola!");
}
Esto solo funciona con funciones declaradas con
function
.
No funciona con funciones flecha o funciones asignadas a variables:
saludar(); // Error
const saludar = () => {
console.log("Hola");
};
¿Por qué? Porque las
const
no se elevan. Así que ojo con eso.
📌 Cierre
¡Buen trabajo! Hoy aprendiste:
- Qué son las funciones y para qué sirven.
- Cómo declararlas y usarlas.
- Cómo pasarles información con parámetros.
- Cómo devolver valores.
- Cómo escribir funciones flecha.
- Qué es el scope y el hoisting.
Las funciones son la herramienta más poderosa que tenemos para escribir código organizado, limpio y reutilizable.
En el próximo módulo vamos a aplicar todo esto para trabajar con arrays y objetos, que son las estructuras de datos más usadas en JavaScript.
¡Nos vemos en el Módulo 5!