viernes, 10 de enero de 2014

Tutorial Javascript parte 7 - Las funciones




Bienvenid@s a un nueva parte del tutorial de Javascript, en esta ocasión continuamos viendo fundamentos básicos del lenguaje y concretamente las funciones.

Una función es un grupo de instrucciones con un objetivo en particular y que se ejecuta cuando es llamada en un punto en concreto del script o programa.

Para este capítulo crea un nuevo archivo y guárdalo como fundamentos-6.js en la carpeta javascript y llámalo en el index.html ...

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="javascript/fundamentos-6.js"></script>
</head>
<body>
</body>
</html>


Para declarar funciones se pueden hacer de dos formas ...

var mi_funcion = function(){
var mensaje = "Hola mundo";
return mensaje;
}

// Para que la función se ejecute hay que llamarla, por ejemplo ...
document.write(mi_funcion());


Con la palabra reservada return podemos retornar el valor devuelto por la función. Y ahora otra forma de crear funciones ...

function otra_funcion()
{
var suma = 12 + 12;
return suma;
}
// Para que la función se ejecute hay que llamarla, por ejemplo ...
document.write(otra_funcion());


Una de las cosas importantes de las funciones, es la posibilidad de agregarle parámetros ...

function multiplica(numero1, numero2)
{
var total = numero1 * numero2;
return total;
}
// Para que la función se ejecute hay que llamarla, por ejemplo ...
document.write(multiplica(2, 2));


En la función nos retornará la multiplicación de 2 * 2.

En el ejemplo de este capítulo verás distintas formas de manejar funciones, función simple, función con parámetros, función con parámetro opcional y función con un parámetro array. Copia el siguiente código y guárdalo en el archivo fundamentos-6.js ...

/*

Una función es un grupo de instrucciones con un objetivo en particular y que se 
ejecuta cuando es llamada en un punto en concreto del script o programa.

*/

//Función simple
mensaje = function(){
return "Hola soy una función";
}
document.write("<p>" + mensaje() + "</p>");

//Función simple
function otro_mensaje(){
var string = "Hola soy otra función";
return string;
}
document.write("<p>" + otro_mensaje() + "</p>");

//Función con parámetro
function suma(numero1, numero2){
var sumar = numero1 + numero2;
return sumar;
}
document.write("<p>" + suma(12, 20) + "</p>");

//Función con parámetro opcional
function multiplicar(numero, opcional)
{
if (opcional == undefined)
{
opcional = 2;
}
return numero * opcional;
}
document.write("<p>" + multiplicar(2, 5) + "</p>");


//Función con un array como parámetro
function imprime_array(array)
{
var elementos = '';
for (var x = 0; x <= array.length-1; x++)
{
elementos += array[x];
}
return elementos;
}
document.write("<p>" + imprime_array(["uno", "dos", "tres", "cuatro"]) + "</p>");


Ahora abre el archivo index.html en el navegador ...



Ahora practica creando nuevas funciones, agrégale parámetros y realiza operaciones para ver el resultado que te devuelve.