Funciones en Javascripts

Las funciones son uno de los bloques de construcción fundamentales en JavaScript. Una función en JavaScript es similar a un procedimiento — un conjunto de instrucciones que realiza una tarea o calcula un valor, pero para que un procedimiento califique como función, debe tomar alguna entrada y devolver una salida donde hay alguna relación obvia entre la entrada y la salida. Para usar una función, debes definirla en algún lugar del ámbito desde el que deseas llamarla.

En programación es muy frecuente que un determinado procedimiento de cálculo definido por un grupo de sentencias tenga que repetirse varias veces, ya sea en un mismo programa o en otros programas, lo cual implica que se tenga que escribir tantos grupos de aquellas sentencias como veces aparezca dicho proceso.

La herramienta más potente con que se cuenta para facilitar, reducir y dividir el trabajo en programación, es escribir aquellos grupos de sentencias una sola y única vez bajo la forma de una FUNCION.

Incluso los programas más sencillos tienen la necesidad de fragmentarse. Las funciones son los únicos tipos de subprogramas que acepta JavaScript. Una definición de función (también denominada declaración de función o expresión de función) consta de la palabra clave function, seguida de:

function <nombre de función>(argumento1, argumento2, ..., argumento n) {
<código de la función>
}

Una función puede recibir tantos argumentos como se deseen, aunque no sería demasiado razonable que una función reciba más de cuatro o cinco parámetros.Los argumentos que se le pasan a la función pueden ser :

valores constantes a los que se denomina literales: por ejemplo 554, true ó ‘aldea’,
variables que contienen un número, un texto o un valor booleano
objetos de naturaleza compleja, como arrays y otros tipos de objetos que veremos más adelante.

Debemos buscar un nombre de función que nos indique cuál es su objetivo (Si la función recibe un string y lo centra, tal vez deberíamos llamarla centrarTitulo). Veremos que una función puede variar bastante en su estructura, puede tener o no parámetros, retornar un valor, etc.

Ejemplo: Mostrar un mensaje que se repita 3 veces en la página con el siguiente texto:

'Cuidado'
'Ingrese su documento correctamente'

'Cuidado'
'Ingrese su documento correctamente'

'Cuidado'
'Ingrese su documento correctamente'

La solución sin emplear funciones es:

<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de JavaScript</title>
<meta charset="UTF-8">
</head>
<body>

<script>
document.write("Cuidado<br>");
document.write("Ingrese su documento correctamente<br>");
document.write("Cuidado<br>");
document.write("Ingrese su documento correctamente<br>");
document.write("Cuidado<br>");
document.write("Ingrese su documento correctamente<br>");
</script>

</body>
</html>

Empleando una función:

<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de JavaScript</title>
<meta charset="UTF-8">
</head>
<body>

<script>
function mostrarMensaje()
{
document.write("Cuidado<br>");
document.write("Ingrese su documento correctamente<br>");
}

mostrarMensaje();
mostrarMensaje();
mostrarMensaje();
</script>

</body>
</html>

Ver ejemplo anterior

Recordemos que JavaScript es sensible a mayúsculas y minúsculas. Si fijamos como nombre a la función mostrarMensaje (es decir la segunda palabra con la primer letra en mayúscula) debemos respetar este nombre cuando la llamemos a dicha función.

Es importante notar que para que una función se ejecute debemos llamarla desde fuera por su nombre (en este ejemplo: mostrarMensaje()).

Cada vez que se llama una función se ejecutan todas las líneas contenidas en la misma.
Si no se llama a la función, las instrucciones de la misma nunca se ejecutarán.

A una función la podemos llamar tantas veces como necesitemos.
Las funciones nos ahorran escribir código que se repite con frecuencia y permite que nuestro programa sea más entendible.

Acotaciones

Hemos estado haciendo uso de funciones existentes por defecto en JavaScript como son:

prompt
parseInt

Recordemos que 'prompt' es una función que nos permite ingresar por teclado una cadena de caracteres, y la función 'parseInt' convierte una cadena de caracteres a tipo de dato entero.

Funciones que devuelven un resultado Return.

Una función JavaScript puede devolver un resultado si se introduce la sentencia return resultado; donde resultado es aquello que queremos devolver (normalmente una variable que contiene un valor numérico, de texto o booleano, pero también podrían ser objetos con mayor complejidad como un array).

Una vez se llega a la sentencia return se produce la devolución del resultado y se interrumpe la ejecución de la función. Por ello la sentencia return será normalmente la última instrucción dentro de una función.
Definición de una función sin parámetros que devuelve un resultado:

//Comentario descriptivo de qué hace la función
function nombreDeLaFunción () {
//Código de la función
return resultado;
}

Definición de una función con parámetros que devuelve un resultado:

//Comentario descriptivo de qué hace la función
function nombreDeLaFunción (param1, param2, …, paramN) {
//Código de la función
return resultado;
}

Ejemplo del uso de una función donde se devuelve un valor por medio de return, en el ejemplo al ingresar un valor devuelve el cuadrado de ese numero

<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de JavaScript</title>
<meta charset="UTF-8">
</head>
<body>
<script>
numero = prompt('Ingrese un numero:','');
//funcion square que hace el cuadrado del valor numero
function square(num) {
var cuad;
cuad = num * num ;
return cuad;
}

cuadrado = square(numero); //llamo a la funcion square y le paso el valor numero
document.write(' Estamos afuera de la funcion, ');
document.write(' el cuadrado del ');
document.write( numero);
document.write(' es ');
document.write(cuadrado);
</script>
</body>
</html>

Ver ejemplo anterior