Creación y uso de funciones en programación

Clase 11 de 84Curso Gratis de Programación Básica

Contenido del curso

Fundamentos de Programación

Desarrollando un juego con HTML y JavaScript

Estilos con CSS

Optimización de código

Mapa con canvas

Backend: videojuego multijugador

Resumen

Cuando aprendes a programar, uno de los momentos más importantes es entender que repetir código es una señal de que algo se puede mejorar. En JavaScript, las funciones son la herramienta que te permite encapsular lógica, reutilizarla y mantener tu programa limpio. A través de una analogía cotidiana y un ejemplo práctico con el juego de piedra, papel o tijera, se explica paso a paso cómo crear, declarar y ejecutar funciones.

¿Qué son las funciones y por qué evitan copiar y pegar código?

Imagina que tienes hambre y vas a la tienda por un sándwich [0:03]. Esa secuencia de acciones —identificar la necesidad, ir al lugar, traer el objeto— la repites sin pensarlo, igual que andar en bicicleta. Tu cerebro crea caminos neuronales que automatizan esas tareas.

En programación ocurre algo muy parecido. Las funciones son pedacitos de código que, escritos de forma general, puedes reutilizar muchas veces [1:08]. La regla es clara: si tienes que copiar y pegar el mismo código, eso merece ser una función. En lugar de duplicar, simplemente la invocas cuando la necesitas.

Por ejemplo, una función llamada traer podría recibir dos parámetros: qué traer y de dónde traerlo [1:30]. Así de flexible:

javascript traer("sándwich", "tienda"); traer("ropa", "armario"); traer("papel", "baño");

Los parámetros se colocan entre paréntesis y permiten que una sola función sirva para múltiples propósitos.

¿Qué diferencia hay entre funciones que retornan y funciones que no retornan?

Algunas funciones devuelven un valor mediante la palabra clave return [2:25]. El resultado se puede almacenar en una variable, como cuando la función traer devuelve el sándwich y lo guardas en comida. Otras funciones, como alert, ejecutan una acción —mostrar una alerta en pantalla— pero no retornan nada [2:50].

¿Cómo se declara una función correctamente en JavaScript?

Al construir la función elección para el juego de piedra, papel o tijera, se aplican varias reglas fundamentales [4:05]:

  • La palabra function siempre va en minúscula.
  • El nombre de la función sigue las mismas reglas que los nombres de variables: debe empezar por letra minúscula, sin números ni caracteres especiales al inicio [5:15].
  • Los paréntesis sirven para declarar o ejecutar la función, dependiendo de si llevan la palabra function delante.
  • Las llaves {} delimitan el bloque de código que pertenece a la función.

javascript function eleccion(jugada) { let resultado = ""; if (jugada == 1) { resultado = "piedra"; } else if (jugada == 2) { resultado = "papel"; } else if (jugada == 3) { resultado = "tijera"; } else { resultado = "mal elegido"; } return resultado; }

¿Por qué es buena práctica declarar las funciones antes de usarlas?

Aunque JavaScript es permisivo y permite usar una función antes de declararla gracias al hoisting, en lenguajes más estrictos como C, C++, Java o Python eso no funciona [4:30]. Es una buena práctica acostumbrarse a definir primero y usar después.

¿Qué es el alcance de las variables dentro de una función?

Las variables declaradas dentro de una función solo existen ahí. Si necesitas un dato externo, debes pasarlo por parámetro [7:30]. JavaScript permite acceder a variables externas, pero no deberías hacerlo porque en lenguajes más estrictos eso no está permitido. Ser disciplinado desde el inicio te prepara para cualquier lenguaje.

¿Cómo se aplica la función al juego de piedra, papel o tijera?

Antes de crear la función, el código repetía bloques casi idénticos para el jugador y para el PC [3:30]. La única diferencia era la palabra "elegiste" o "elige". Con la función eleccion, todo ese código duplicado se reemplaza por dos líneas simples [9:50]:

javascript alert("PC elige: " + eleccion(pc)); alert("Tú eliges: " + eleccion(jugador));

La indentación con Tab dentro de las llaves es otra buena práctica que hace visible la estructura del código [6:45]. Un código mal indentado, con esa "escalerita" confusa, delata a un programador novato. Equivocarse es parte del proceso: paréntesis sobrantes, comillas perdidas y comas olvidadas son errores que nunca desaparecen por completo, incluso después de más de veinte años programando [8:20].

Ahora que dominas los fundamentos de las funciones, ¿qué bloques de código repetido podrías convertir en funciones dentro de tus propios proyectos? Comparte tu experiencia en los comentarios.