animaci Lección 13
>>
Lección 13


Ejemplos de Java Script.


Esta sección no es un minicurso de JavaScript. Su único objetivo es dar al alumno algunas bases elementales sobre JavaScript para que conozca su diferencia con Java y también sus posibles relaciones.

JavaScript es un lenguaje para programar páginas Web que fue diseñado por Netscape. No compite con Java pues su campo de aplicación está en dar interacción a las páginas Web a través de sus propios elementos como son las formas, mientras que Java es un lenguaje de programación de uso general. Los applets de Java son núcleos interactivos incrustados en páginas Web, pero su relación con las páginas mismas es pobre mientras que JavaScript puede tener una relación muy rica con las páginas Web, incluso puede crear páginas al instante. Las limitaciones de JavaScript también son claras. Es un lenguaje que sólo puede vivir dentro de las páginas Web y, por ser un lenguaje puramente interpretado, no tiene un compilador que nos informe de los posibles errores de programación, así que la única manera de detectarlos es durante la ejecución.

Lo más importante que deseamos exponer sobre JavaScript es que 

Esto hace que la combinación de applets y JavaScript sea una herramienta muy útil para el enriquecimiento de páginas Web, especialmente páginas Web educativas.

Ahora usaremos unos botones de una forma html para detener y arrancar una animación (que como ejemplo corresponde a la lección 7). En primer lugar damos el nombre mapas1 al applet ejem14.simpanim al insertarlo en la página. Esto se hace dentro de la etiqueta <applet> así:

<applet name="mapas1" code="ejem14.simpanim.class" codebase="./"
              width="156" height="120">

Luego, en la forma, al definir los botones se les agrega un parámetro onclick="mapas1.parar()" en el botón de parar y  onclick="mapas1.continuar()" en el otro botón:

<form>
<p>
<input type="button" value="parar" onclick="mapas1.parar()">
<input type="button" value="continuar" onclick="mapas1.continuar()">
</p>
</form>

Este es el resultado:

En este sencillo ejemplo se han utilizado tres cosas fundamentales de JavaScript:

Para aclarar mejor el segundo punto hacemos otra llamada al mismo applet dándole otro nombre: name="mapas2" y agregamos otra instrucción de JavaScript al código asociado a onclick:

<form>
<p>
<input type="button" value="parar"
       onclick="mapas2.parar(); alert('animación detenida');">
<input type="button" value="continuar"
       onclick="mapas2.continuar(); alert('animación funcionando');">
</p>
</form>

Este es el resultado. Deberá dar unos mensajes al pulsar los botones, además de parar o continuar la animación:

Como puede verse en este ejemplo el control de applets desde formas de una página Web es sencillo, siempre y cuando los applets hayan sido programados con funciones públicas adecuadas para ello. Por lo tanto es importante que el programador de applets tenga en mente esta posibilidad y cuando defina sus funciones externas lo haga pensando en que podrían ser utilizadas por un programador de JavaScript.

Veamos ahora una aplicación ligeramente más compleja. Se trata de un applet que se puede controlar usando sus propios botones o bien los de la forma en la página.

 

 




Nuevamente, esto se logra asociando al evento onclick un código de JavaScript, pero esta vez ese código hace llamadas a  funciones de JavaScript definidas en el encabezado de la página. Estudie el código JavaScript al principio esta página y busque la inserción de este applet y la forma asociada que lo controla.

Si su navegador reconociese la etiqueta de applet, aquí vería un applet

Para definir funciones y código JavaScript es necesario incluirlo entre las etiquetas: <SCRIPT LANGUAGE="JavaScript"> y </SCRIPT>. Es conveniente colocar las funciones que se van a utilizar en la página dentro de la cabecera del HTML, es decir, entre las etiquetas <HEAD> y </HEAD>, tal como se hizo en este caso.

Como puede verse, en JavaScript no se declaran los tipos de las variables. Esto lo hace fácil de usar para programadores novatos pero muy incómodo para los expertos. El paso de parámetros a los métodos de un applet requiere de mucho cuidado. Lo más recomendable es sólo enviar parámetros en forma de cadenas (Strings) para evitar problemas en las conversiones de tipo.

JavaScript tiene muchas otras aplicaciones además de controlar applets. La más espectacular es la generción de páginas Web al instante, es decir, tiene la capacidad de crear páginas Web que no existen como archivos en ningún servidor,  y hacer que el navegador las lea. Los siguientes ejemplos muestran ésta y otras posibilidades del JavaScript. 


Generación de páginas al instante
Ejemplos sencillos de esta posibilidad.

Éste es el código HTML-JavaScript de la página JStest.html.
Si su navegador reconociese la etiqueta de applet, aquí vería un applet


La fecha y la hora cada segundo
Una página Web que cambia con el tiempo.

Éste es el código HTML-JavaScript de la página fechayhora.html.
Si su navegador reconociese la etiqueta de applet, aquí vería un applet


Una clase en JavaScript
Cómo crear una clase en JavaScript.

Éste es el código HTML-JavaScript de la página JScircle.html.
Si su navegador reconociese la etiqueta de applet, aquí vería un applet


Configuración de un applet
Usando un applet y una forma se define la configuración de otro applet y se crea instanténeamente una página con el applet configurado. El applet que se usa en este ejemplo es uno de los que se desarrollarán en la lección 7.

Éstos son los códigos HTML-JavaScript de las cuatro páginas
que conforman el ejemplo:
Si su navegador reconociese la etiqueta de applet, aquí vería un applet

Si su navegador reconociese la etiqueta de applet, aquí vería un applet

Si su navegador reconociese la etiqueta de applet, aquí vería un applet

Si su navegador reconociese la etiqueta de applet, aquí vería un applet

Nota: Los autores de este curso agradecen a su amigo Fermín Revueltas la aportación de este ejemplo.


Índice

Ejercicios de la Lección 06.


José Luis Abreu y Marta Oliveró