Una función es un grupo de instrucciones JavaScript que se pueden invocar mediante un nombre. Dentro de una función puede haber invocaciones a otras funciones. |
Como sucede en otros lenguajes de programación, la definición de funciones nos permiten definir un código que será fácilmente reutilizable a lo largo de un programa con sólo invocarlo por su nombre de función. Si ese código está además en un archivo independiente de la página, podrá ser aprovechado por diferentes páginas.
El uso de funciones permite la creación de un código más claro, más compacto y más fácil de mantener. |
El propio lenguaje JavaScript tiene sus funciones pero lo más interesante es que el desarrollador puede crear sus propias funciones o utilizar funciones escritas por terceros.
Las funciones pueden recibir parámetros y pueden devolver resultados, en ambos casos son opciones no obligatorias.
El formato de la definición de una función es el siguiente:
function nombreFunción ([parm1],[..., parmN]) { ... [return valorRetorno]; }
El código encerrado entre las llaves de la definición de la función se denomina "cuerpo" de la función y opcionalmente se puede devolver un valor de retorno mediante la sentencia return.
Una función se puede asignar a una variable, por lo que se puede considerar otro tipo de dato.
Normalmente una función puede utilizar parámetros que son datos que recibe en el momento de su invocación. |
Pase de parámetros a la función
Loa parámetros de una función pueden ser cadenas, números, valores booleanos y objetos JavaScript o personalizados. Los parámetros se pueden pasar como variables o como literales. Una función puede tener definida una lista de n parámetros pero en la llamada a la función se pueden utilizar cero, uno o más parámetros, es decir, menos de los definidos, ya que opcionalmente se pueden pasar sólos los primeros de la lista. Cuando un se pasan menos parámetros de los definidos en la función, los valores no pasados se asignan con el valor null.
Invocación a la función
Desde el cuerpo de una función se puede llamar a otra función e incluso, tal como veremos posteriormente, también se puede llamar a la propia función, en lo que se denomina una llamada recursiva.
Por ejemplo:
function miPopup(N) { // mi función de popup de mensajes alert(N); return "OK"; }
Cómo saber cuál fue la función invocante
Dentro de una función podemos averiguar cuál es la función llamante utilizando la propiedad caller. La propiedad caller también informa todo el código de la función llamante:
<SCRIPT language=javascript> function miFunción1(valor) { document.write("Quién realizó la llamada a miFunción1 -> "+miFunción1.caller+"<BR>"); miFunción2(valor); } function miFunción2(valor) { document.write("Quién realizó la llamada a miFunción2 -> "+miFunción2.caller+"<BR>"); document.write("parámetro -> "+valor+"<BR>"); miFunción3(valor); } function miFunción3(valor) { document.write("Quién realizó la llamada a miFunción3 -> "+miFunción3.caller+"<BR>"); document.write("parámetro -> "+valor+"<BR>"); } miFunción1("1"); miFunción2("2"); </SCRIPT>
Este código produce esta salida:
Quién realizó la llamada a miFunción1 -> null Quién realizó la llamada a miFunción2 -> function miFunción1(valor) { document.write("Quién realizó la llamada a miFunción1 -> "+miFunción1.caller+""); miFunción2(valor); } parámetro -> 1 Quién realizó la llamada a miFunción3 -> function miFunción2(valor) { document.write("Quién realizó la llamada a miFunción2 -> "+miFunción2.caller+""); document.write("parámetro -> "+valor+" "); miFunción3(valor); } parámetro -> 1 Quién realizó la llamada a miFunción2 -> null parámetro -> 2 Quién realizó la llamada a miFunción3 -> function miFunción2(valor) { document.write("Quién realizó la llamada a miFunción2 -> "+miFunción2.caller+""); document.write("parámetro -> "+valor+" "); miFunción3(valor); } parámetro -> 2
El valor null indica que la llamada se realizó desde el tronco principal del código.
Autoinvocación de una función
El factorial de un número n es la multiplicación de 1 * 2 * 3…*(n-1) * n; es decir el factorial de 5 sería entonces: 1 * 2 * 3 * 4* 5 = 120.
Veamos cómo se puede resolver esto en una función:
function factor(n){ if (n== 1) return 1; else return (n * factor(n-1)); }
Y esta función simplemente se llamaría con esta sintaxis:
factorial = factor(5); // o el número que corresponda
¿Dónde está la magia?
No hay magia, simplemente es la capacidad de una función que se llama a sí misma n veces.
La llamada factor(5) provoca que dentro de la función factor se produzca una segunda llamada a la función factor pero en este caso con el parámetro restado en 1, o sea con factor(4). Es decir:
El programa llama a factor(5)
factor(5) llama a factor(4)
factor(4) llama a factor(3)
factor(3) llama a factor(2)
factor(2) llama a factor(1)
Y esto se repite hasta que se produce la llamada con n igual a 1, a partir de la cual se producen los retorno de las funciones llamadas:
factor(1) devuelve 1
factor(2) devuelve 2 (es decir, 1 * 2)
factor(3) devuelve 6 (es decir, 2 * 3)
factor(4) devuelve 24 (es decir, 6 * 4)
factor(5) devuelve 120 (es decir, 24 * 5)
Obviamente, esto se puede resolver con otra función muy simple pero menos sorprendente:
function factor2(n) { var fact = 1; for (; n > 1; n--){ fact *=n; } return (fact); }
En este caso no se utiliza la recursividad sino que simplemente se resuelve el problema con un bucle for. Lo que debe quedar claro es que en programación no hay una única solución a un problema.