Introducción a Funciones JS

Cuando se desarrolla una aplicación compleja, es muy habitual utilizar una y otra vez las mismas instrucciones.

Pongamos un ejemplo sencillo, imaginemos que queremos conocer el área de un rectángulo, para eso podríamos escribir algo como esto:

const width = 10;
const height = 6;
const area =  width * height;
console.log(area); // Output: 60

Pero, ¿ qué pasa si queremos el área de varios rectángulos?? Tendríamos que escribir muchas más variables para identificar cada uno de los rectángulos y eso ya no sería óptimo.

Así que en lugar de reescribir el mismo código, podemos agrupar un bloque de código y asociarlo con una tarea, luego podemos reutilizar ese bloque de código cuando sea necesario volver a realizar la tarea. Esto lo logramos creando una función. Una función es un bloque de código reutilizable que agrupa una secuencia de instrucciones para realizar una tarea específica.

Declarando una función

Las funciones en JavaScript se definen mediante la palabra reservada function, seguida del nombre de la función. Su definición formal es la siguiente:

La declaración consiste en:

• La palabra clave de la función.
• El nombre de la función, o su identificador, seguido de paréntesis.
• El cuerpo de una función, o el bloque de instrucciones requerido para realizar una tarea específica, encerrado entre los corchetes de la función, {}.

El nombre de la función se utiliza para llamar a esa función cuando sea necesario. El concepto es el mismo que con las variables, a las que se les asigna un nombre único para poder utilizarlas dentro del código.

Llamando una función

Definir una función no la ejecuta. Definir una función simplemente la nombra y especifica qué hacer cuando la función es llamada. Llamar la función es lo que realmente realiza las acciones especificadas con los parámetros indicados.

Para llamar a una función en el código, debemos escribir el nombre de la función seguido de paréntesis (). De esta manera podemos llamar a la misma función tantas veces como sea necesario.

Argumentos

Las funciones más sencillas no necesitan ninguna información para producir sus resultados. Sin embargo, la mayoría de funciones de las aplicaciones reales deben acceder al valor de algunas variables para producir resultados.

Las variables que necesitan las funciones se llaman argumentos. Antes de que pueda utilizarlos, la función debe indicar cuántos argumentos necesita y cuál es el nombre de cada argumento. Además, al invocar la función, se deben incluir los valores que se le van a pasar.

Usando el ejemplo de los rectángulos podemos hacer una función y reutilizarla las veces que necesitemos.

function getArea(width, height){
    var area = width * height
    console.log(area)
}

Haciendo uso de los argumentos podemos cambiarlos al llamar a la función:

getArea(19, 10) // rectángulo 1
getArea(34, 20) // rectángulo 1
...

Recuerda que el orden de los argumentos es fundamental, ya que el primer dato que se indica en la llamada, será el primer valor que espera la función; el segundo valor indicado en la llamada, es el segundo valor que espera la función y así sucesivamente.

Aprende más sobre JavaScript y la mejor forma de iniciarte en este lenguaje visitando la página de MUKTEK.