Valores de retorno en funciones Javascript

  • Por
Las funciones pueden devolver valores, a través de la sentencia return. También vemos un apunte sobre el ámbito de variables en funciones en Javascript.

Estamos aprendiendo acerca del uso de funciones en Javascript y en estos momentos quizás ya nos hayamos dado cuenta de la gran importancia que tienen para hacer programas más o menos avanzados. En este artículo del Manual de Javascript seguiremos aprendiendo cosas sobre funciones y en concreto que con ellas también se puede devolver valores. Además, veremos algún caso de uso interesante sobre las funciones que nos puede aclarar un poco el ámbito de variables locales y globales.

Devolución de valores en las funciones

Las funciones en Javascript también pueden retornar valores. De hecho, ésta es una de las utilidades más esenciales de las funciones, que debemos conocer, no sólo en Javascript sino en general en cualquier lenguaje de programación. De modo que, al invocar una función, se podrá realizar acciones y ofrecer un valor como salida.

Por ejemplo, una función que calcula el cuadrado de un número tendrá como entrada a ese número y como salida tendrá el valor resultante de hallar el cuadrado de ese número. La entrada de datos en las funciones la vimos anteriormente en el artículo sobre parámetros de las funciones. Ahora tenemos que aprender acerca de la salida.

Veamos un ejemplo de función que calcula la media de dos números. La función recibirá los dos números y retornará el valor de la media.

function media(valor1,valor2){ 
   	var resultado 
   	resultado = (valor1 + valor2) / 2 
   	return resultado 
}

Para especificar el valor que retornará la función se utiliza la palabra return seguida de el valor que se desea devolver. En este caso se devuelve el contenido de la variable resultado, que contiene la media calculada de los dos números.

Quizás nos preguntemos ahora cómo recibir un dato que devuelve una función. Realmente en el código fuente de nuestros programas podemos invocar a las funciones en el lugar que deseemos. Cuando una función devuelve un valor simplemente se sustituye la llamada a la función por ese valor que devuelve. Así pues, para almacenar un valor de devolución de una función, tenemos que asignar la llamada a esa función como contenido en una variable, y eso lo haríamos con el operador de asignación =.

Para ilustrar esto se puede ver este ejemplo, que llamará a la función media() y guardará el resultado de la media en una variable para luego imprimirla en la página.

var miMedia 
miMedia = media(12,8) 
document.write (miMedia)

Múltiples return

En realidad en Javascript las funciones sólo pueden devolver un valor, por lo que en principio no podemos hacer funciones que devuelvan dos datos distintos.

Nota: en la práctica nada nos impide que una función devuelva más de un valor, pero como sólo podemos devolver una cosa, tendríamos que meter todos los valores que queremos devolver en una estructura de datos, como por ejemplo un array. No obstante, eso sería un uso más o menos avanzado que no vamos a ver en estos momentos.

Ahora bien, aunque sólo podamos devolver un dato, en una misma función podemos colocar más de un return. Como decimos, sólo vamos a poder retornar una cosa, pero dependiendo de lo que haya sucedido en la función podrá ser de un tipo u otro, con unos datos u otros.

En esta función podemos ver un ejemplo de utilización de múltiples return. Se trata de una función que devuelve un 0 si el parámetro recibido era par y el valor del parámetro si este era impar.

function multipleReturn(numero){ 
   	var resto = numero % 2 
   	if (resto == 0) 
      	return 0 
   	else 
      	return numero 
}

Para averiguar si un número es par hallamos el resto de la división al dividirlo entre 2. Si el resto es cero es que era par y devolvemos un 0, en caso contrario -el número es impar- devolvemos el parámetro recibido.

Ámbito de las variables en funciones

Dentro de las funciones podemos declarar variables. Sobre este asunto debemos de saber que todas las variables declaradas en una función son locales a esa función, es decir, sólo tendrán validez durante la ejecución de la función.

Nota: Incluso, si lo pensamos, nos podremos dar cuenta que los parámetros son como variables que se declaran en la cabecera de la función y que se inicializan al llamar a la función. Los parámetros también son locales a la función y tendrán validez sólo cuando ésta se está ejecutando.

Podría darse el caso de que podemos declarar variables en funciones que tengan el mismo nombre que una variable global a la página. Entonces, dentro de la función, la variable que tendrá validez es la variable local y fuera de la función tendrá validez la variable global a la página.

En cambio, si no declaramos las variables en las funciones se entenderá por javascript que estamos haciendo referencia a una variable global a la página, de modo que si no está creada la variable la crea, pero siempre global a la página en lugar de local a la función.

Veamos el siguiente código.

function variables_glogales_y_locales(){
   var variableLocal = 23
   variableGlobal = "qwerty"
}

En este caso variableLocal es una variable que se ha declarado en la función, por lo que será local a la función y sólo tendrá validez durante su ejecución. Por otra parte variableGlobal no se ha llegado a declarar (porque antes de usarla no se ha utilizado la palabra var para declararla). En este caso la variable variableGlobal es global a toda la página y seguirá existiendo aunque la función finalice su ejecución. Además, si antes de llamar a la función existiese la variable variableGlobal, como resultado de la ejecución de esta función, se machacaría un hipotético valor de esa variable y se sustituiría por "qwerty".

Nota: Podemos encontrar más información sobre ámbito de variables en un artículo anterior.

Con esto hemos terminado el tema de las funciones, así que en adelante nos dedicaremos a otros asuntos también interesantes, como son los Arrays en Javascript.

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir

Comentarios

David

13/2/2008
me gustaria saber si el operador arimetico "media" en la linea dos del codigo esta definido en java y en donde o si se tiene que instanciar a la hora de codificar ,,,,,, gracias por adelantado


var miMedia
miMedia = media(12,8)
document.write(miMedia)

Emmanuel

16/8/2010
Duda del tema
Hola que tal, pues mira intente compilar el ejemplo que tienes, pero despues de la fucncion no se en dodne poner esto
var miMedia
miMedia = media(12,8)
document.write (miMedia)

y pongo un apartado en el body para que me imprima el resultado pero no me sale nada a ver si me puedes ayudar o poner el ejemplo ya compilado por que no se que hacer
<script>
mediaValor()
</script>

midesweb

28/9/2010
ejemplo completo de la media
Hola Emmanuel, el ejemplo completo con el código podría ser como esto:

<html>
<head>
<title>Calcular la media</title>
<script>
function media(valor1,valor2){
var resultado
resultado = (valor1 + valor2) / 2
return resultado
}
</script>
</head>

<body>

Ahora voy a ejecutar la media, de 12 y 8:
<SCRIPT>
var miMedia
miMedia = media(12,8)
document.write (miMedia)
</SCRIPT>

<br>
<br>
<br>
O podría ejecutar más simple así:
<SCRIPT>
document.write (media(10,5))
</SCRIPT>
</body>
</html>

Copia ese código, lo guardas como loquesea.html y lo ejecutas para verlo en el navegador.

MV

17/11/2010
Ámbito de variables
Se hace preciso aclarar un detalle respecto al ámbito de una variable-ejemplo que se usa al final de este artículo:

Se dice que la variable variableGlobal no se ha declarado, y eso es verdad a medias: Lo cierto es que ESTRICTAMENTE no es una declaración. Es decir, el intérprete decidirá si

variableGlobal = "qwerty"

debe tomarse como una asignación a una variable ya existente (global) o bien como una nueva variable declarada a nivel de función (var. local), dependiendo siempre de la existencia o no de otra var. con el mismo nombre (var. global).

Ese es, por lo menos, el comportamiento que tiene el código que he probado yo. (Estoy usando la última versión de Mozilla Firefox -3.6.12-). La verdad, no sé exactamente si en los comienzos de JavaScript debió ser así, pero ahora os puedo asegurar que para nada funciona de esta manera actualmente.

Espero haber sido de ayuda. Saludos.

anndresorozco

27/11/2011
Valores ingresados por usuario
Hola, mi pregunta es a siguiente. ps mi funcion es esta:

function media(num1, num2){
var result = (num1 + num2) / 2;
return result;
}

y estoy imprimiendo esto:

document.write("The media is: " + media(5, 7));

lo que yo quiero saber es si hay alguna forma de que el usuario por medio de un prompt ingrese los valores para num1 y num2 que en este caso serian el 5 y 7.

Intente de todas las formas que se me ocurrio pero como apenas estoy aprendiendo pues no se como hacerlo. Espero puedas ayudarme.

Muchas gracias

javier

25/1/2012
Problemas con una variable
Hola.
Realmente estoy bloqueado.
No se como solucionarlo.
Tengo un procedimiento en php que carga un select.
Del select quiero obtener uno de los registros presentados y posteriormente hacer una llamada a otro procedimiento php.
El problema viene que intento pasar el valor del select mediante:
<li><a href="adol00b.php?codigo= " +valo ; onclick=valo=datos()>Bajas</a></li>

y no me devuelve nada aunque el procedimento js datos() al hacer una alert si tiene contenido la variable valo. La variable esta definida como global. Todo esta englobado en un php.

Donde esta el fallo?.

Realmente necesito una respuesta.
Estaria muy agradecido a quien me ayudara.
Javier.

Cesc MF

23/10/2012
Variable local/global
Saludos y gracias por los artículos.
Mi prigunta es: ¿cuando declaras una variable local en una función con el var y la "sacas" con el return (como haces en el artículo con el ejemplo de la function media), esta variable se convierte en global y la puedes utilizar como parametro para otra función?

Gracias

Agus

30/8/2013
Valores ingresados por usuario (respuesta)
Te dejo el codigo que pides para que el usuario ingrese los numeros y se le calcule la media, un saludo.

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript">

function media (num1, num2) {
var resultado
resultado = (parseInt(num1) + parseInt(num2)) / 2;
return resultado;
}
var num1 = prompt("Escibre un numero");
var num2 = prompt("Escribe otro numero");
media(num1, num2);
var miMedia
miMedia = media(num1, num2);
document.write("La media de los dos numeros es " + miMedia);
</script>
<style type="text/css">
body {
background-color: yellow;
color: blue;
}
</style>
</head>
<body>
</body>
</html>