Sei sulla pagina 1di 9

9. JavaScript: funciones 9.

1 Introduccin
La mayora de los programas de computadora que resuelven problemas reales son mucho ms grandes que los que hemos presentado en los primeros captulos de este libro. Comenzar a usar JavaScript para interactuar de manera programtica con los elementos de una pgina Web, de modo que pueda obtener valores de ellos y colocar contenido en elementos de pginas Web.

9.2 Mdulos de programas en JavaScript


Las secuencias de comandos que escribimos en JavaScript contienen por lo general una o ms piezas, conocidas como funciones. Usted combinara las nuevas funciones que escriba con las funciones y objetos pre empaquetado disponibles en JavaScript. Las funciones pres empaquetados que pertenecen a objetos de JavaScript se llaman mtodos. JavaScript cuenta con varios objetos que tienen una extensa coleccin de mtodos para realizar clculos matemticos comunes, manipulaciones de cadenas, manipulaciones de fechas y horas, y manipulaciones de colecciones de datos conocidas como arreglos. Usted puede escribir funciones para definir tareas que pueden usarse en muchos lugares en una secuencia de comandos. Una funcin se invoca mediante una llamada a funcin. La llamada a la funcin especfica el de nombre de la funcin y provee la informacin que la funcin invocada necesita para realizar su tarea.

9.3 Definiciones de funciones


Ahora consideraremos como puede escribir sus propias funciones personalizadas y llamarlas en una secuencia de comandos.

9.3.1 La funcin cuadrado definida por el programador


Considere una secuencia de comandos que utiliza una funcin cuadrado para calcular los cuadrados de los enteros del 1 al 10.

<meta charset "utf-8">

<title> Una fuci&oacute;n cuadrado definida porel programador</title> <style type = "text/css"> p { margin: 0; }

</style> <script>

document.writeln( "<h1>Obtener el cuadrado de los n&uacute;meros del 1 al 10</

// obtener el cuadrado de klos numeros 1 al 10 for (var x = 1; x <= 10; ++x document.writeln( "<p>El cuadrado de "+ x + " es " + cuadrado(x) + "</p>" );

// El cuerpo de la siguiente definicion de la funcion cuadrado se efectua // solo cuando la funcion se llama de manera explicita como en la lina 19 funcion cuadrado( y ) {

return y * y; } // fin de la funcion cuadrado </script> </head><body></body> <!-el elemento body est&aacute; vac&iacute;o--> </html>

Definicin de la funcin cuadrado La definicin de la funcin cuadrado muestra que cuadrado espera un solo parmetro la funcin cuadrado usa este nombre en su cuerpo para manipular el valor que se pasa a cuadrado de la llamada a la funcin. Debe a ver un argumento en la llamada a la funcin para cada parmetro en su definicin. Si una funcin no recibe valores la lista de parmetros esta vaca . La declaracin e instrucciones entre las llaves forman el cuerpo de la funcin.

9.4 Notas sobre las funciones definidas por el programador


Todas las variables declaradas con la palabra clave var en las definiciones de funciones son las variables locales; esto significa que pueden utilizarse solo en la funcin en la que estn definidas. Los parmetros de una funcin tambin se consideran variables locales. Hay varias razones para la maduracin de un programa con funciones. La metodologa divide y vencers hace ms manejable el desarrollo de los programas .Otra razn es la reutilizacin del software.

9.5 Generacin de nmeros aleatorios


Ahora daremos un breve paseo por una popular aplicacin de programacin, relacionada con la simulacin y los juegos. En esta y la siguiente seccin desarrollaremos un programa de juego estructurado de manera cuidadosa, que incluye varias funciones. Considere la siguiente instruccin: Var valor Aleatorio = Math.random();

El mtodo random genera un valor de punto flotante de 0.0 a 1.0 pero sin llegar a 1.0. Si en verdad random valore al azar, entonces todo valor en ese rango tiene la misma oportunidad de ser elegido cada vez que se llame a random.

9.5.1 Escalar y desplazar nmeros aleatorios


El rango de valores producidos directamente por random es a menudo distinto de lo que se requiere en una aplicacin en particular. Por ejemplo un programa que simula el lanzamiento de una moneda podra requerir solo 0 para guila y 1 para sol. Para demostrar el mtodo random , desarrollaremos una programa que simula 30 litros de un lado de seis lados y muestra el valor de cada tiro , usamos el operador de manipulacin (*) con random de la siguiente manera: Math.floor (1 + Math.random() * 6 )

La expresin anterior multiplica el resultado de una llamada a Math.random() por 6 para producir un valor desde 0.0 hasta 6.0, pero sin llegar a ese ltimo nmero.

9.5.2 Visualizar imgenes aleatorias


El contenido web que vara al azar puede agregar efectos dinmicos interesantes en una pgina. Interacciones del usuario mediante el manejo de eventos Hasta ahora todas las interacciones del usuario con las secuencias de comandos han sido a travs de un dialogo prompt o un dialogo alert . Aunque esos dilogos son formas validas de recibir entrada de un usuario y mostrar mensajes, son bastante limitados en cuanto a sus capacidades. Un dialogo prompt puede obtener del usuario solo un valor a la vez ; un dialogo de mensaje solo para mostrar un mensaje. El elemento body Antes de hablar sobre el cdigo de la secuencia de comandos, considere el elemento body de este documento Los elementos dentro de body se usan mucho en la secuencia de comandos. El elemento form La lnea 53 comienza la definicin de un elemento form en HTML 5. El estndar de HTML requiere que todo elemento form contenga un atributo action, pero como este formulario no publica su informacin en un servidor Web, se utiliza la cadena # para permitir que este documento se valide. El smbolo # en si representa a la pgina actual.

9.5.3 Tirar el dado repetidas veces y mostrar las estadsticas


Para mostrar que los valores aleatorios que representan a los dados ocurren con una probabilidad aproximadamente igual , dejaremos que el usuario tire 12 dados al mismo tiempo y llevaremos las estadsticas que muestran el nmero de veces que ocurre cada cara . Variables de secuencias de comandos Las lneas 22 a 28 declaran e inicializan variables contador para llevar la cuenta del nmero de veces que aparece cada uno de los seis dados, junto con el nmero total de datos tirados. Funcin sumar Tiros La funcin sumarTiros contiene una instruccin switch que utiliza el valor de cara elegido al azar como su expresin de control. Con base en el valor de cara, el programa incrementa una de las seis variables contador durante cada interaccin del ciclo. Funcin establecer Imagen La funcin establecerImagen establece el origen y el texto alt para el elemento img especificado.

9.6 Ejemplo: Juego de probabilidad; introduccin a los elementos de audio y video de HTML 5
Uno de los juegos de azar ms populares es el juego de dados conocido como craps el cual se juega en casinos y callejones por todo el mundo. Las reglas del juego son simples: La secuencia de comando en la figura 9.7 simula el juego de craps. Cabe mencionar que el jugador debe tirar dos dados en el primer tiro y hacer lo mismo en todos los iros subsiguientes. Al cargar este documento puede hacer clic en el vnculo de la parte superior de la pgina para ver un documento separado que contiene un video en el que se explica las reglas bsicas del juego. Para iniciar un juego , haga clic en el botn Reproducir. Un mensaje debajo del botn muestra el estado del juego despus de cada tiro. Si no gana o pierde en el primer tiro haga clic ene l botn tirar de nuevo. El elemento de audio de HTML5 Un elemento de HTML 5 se usa para incrustar audio en una pagina Web especificamos un id para el elemento de modo que podamos controlar por medio de programacin el momento en que se reproduzca el audio, con base en las interacciones del usuario con el juego.

El vnculo de la pgina ReglasCraps.html Las lneas 157 y 158 muestran un vnculo a una pgina Web separada en la que usamos un elemento video de HTML5 para mostrar un video corto que explica las reglas bsicas del juego de Craps . PuntoDiv y tiroDiv Los elementos Div en las lneas 159 y 171 contienen los elementos img donde mostramos imgenes de un dado que representa el punto del usuario y el tiro actual de los dados , respectivamente .Cada elemento img contiene una tributo id para que podamos interactuar con el por medio de programacin. Puesto que el atributo id debe tener un valor nico , JavaScript puede referirse de manera confiable a cualquier elemento individual por medio de su atributo id. El elemento form Define que el elemento form de HTML5 que contiene dos elementos input tipo button. El evento click de cada elemento button indica la accin a realizar cuando el usuario hace clic en el botn correspondiente. El elemento p La lnea 176 define un elemento p en el que el juego muestra los mensajes de estado del usuario. Las variables de la secuencia de comandos Las lneas 19 a 31 crean variables que se utilizan en toda la secuencia de comandos , recuerde que , como etas se declaran fuera de las secuencias de comandos , son accesibles para todas las funciones en esta.

9.7 Reglas de alcance


En los captulos 6 y 8 usamos identificadores para los nombres de variable. Los atributos de las variables incluyen nombre, valor y tipo de datos. Tambin usamos identificadores como nombres para las funciones definidas por el usuario. Cada identificador en un programa tiene tambin un enlace. El enlace de un identificador para una variable o funcin es la parte del programa en donde se puede hacer referencia al identificador. Las varales globales o variables a nivel de secuencia de comandos que se declaran en el momento head pueden usarse en cualquier parte de una secuencia de comandos y se dice que tienen alcance global. Los identificadores que se declaran dentro de una funcin tienen alcance de funcin y pueden usarse solo en esa funcin. El alcance de funcin empieza con la llave izquierda de apertura de la funcin en la que se declara el identificador y termina en la llave derecha de terminacin. Las

variables locales y los parmetros de funcin tienen alcance de funcin. Si una variable local tiene el mismo nombre que una variable global, la variable global esta oculta del cuerpo de la funcin. La variable global x se declara e inicializa eb 1. Esta variable global se oculta en cualquier bloque que declara una variable x. La secuencia d comandos define otras dos funciones funcionA funcin, ninguna de las cuales recibe argumentos y tampoco devuelven nada. Cada funcin se llama dos veces dese iniciar. La funcin la funcionA define la variable local x y la inicializa con 25.

9.8 Funciones globales de JavaScript


JavaScript con nueve funciones globales estndar. Las funciones globales son parte del objeto global de JavaScript.. El objeto global contiene todas las variables globales en la secuencia de comandos todas las funciones definidas poer el usuario en la secuencia de comandos y todas las funciones listadas de la figura.

9.9 Recursividad
Los programas que hemos visto ahora estn estructurados de manera general como funciones que se llaman entre si de una manera disciplinada y jerrquica. Una funcin recursiva se llama as misma ya sea de manera directa o indirecta por medo de otra funcin. La recursividad es un tema importante de ciencias computacionales . En esta seccin presentaremos un ejemplo simple de recursividad.

El paso de la recursividad se ejecuta mientras que la llamada original a la funcin sigue abierta. El paso de recursividad puede producir muchas llamadas recursivas ms ya que la funcin divide cada nuevo su problema en dos piezas conceptuales. Para que la recursividad termine en un momento dado, cada vez que la funcin se llama a si misma con una versin ms simple del problema original la secuencia de problemas cada vez mas pequeos debe converger en el caso base. N( n-1) . (n-2) .1

9.10 Comparacin entre recursividad e interaccin


En la seccin anterior estudiamos una funcin que puede implementarse con facilidad ya sea en forma recursiva o interactiva. En esta seccin comparar aremos los enfoques y discutiremos por que podra ser conveniente elegir una metodologa en vez de la otra en una situacin especfica. Tanto la interaccin como la recursividad se utilizan en una instruccin de control: la interaccin Es una instruccin de repeticin (por ejemplo for, while o do while ); la recursividad es una instruccin de seleccin ( por ejemplo , if , if , .else o switch). La interaccin y la recursividad implican una prueba de terminacin: la interaccin termina cuando falla la condicin de continuacin de ciclo; la recursividad termina cuando se conoce un caso base.

Potrebbero piacerti anche