¿Para qué queremos hacer una función? Las funciones nos permiten mucha mayor flexibilidad que el código insertado directamente en el manejador de un evento. Por ejemplo, supongamos que para 5 botones (<Input type=button...>) queremos la misma acción. Con una función, podemos declarar la acción una sola vez y mandarla "llamar" 5 veces.. Lo anterior, además de darle orden y seriedad al código JavaScript.
Primero debemos crear una "sección" de Script. Un lugar en donde esté escrito nuestro código. Esto se logra con el TAG SCRIPT:
<SCRIPT Language="JavaScript">
// Aquí va el código de JavaScript.
</SCRIPT>
Nótese como es necesario poner el atributo Language="JavaScript" en el tag SCRIPT. Lo anterior se debe a que HTML soporta varios lenguajes de Scripting (ej: VBScript). Otro punto inportante del ejemplo de arriba, es la línea que contiene doble "slash" al principio. Se trata de un comentario. Hay 2 tipos de comentario: de fin de línea y de sección. El primero (como el mencionado arriba), inicia a partir del "//" y termina con el fin de línea. El de bloque, como su nombre sugiere, puede abarcar varias líneas. Tiene un delimitador de inicio y fin de bloque; "/*" y "*/" respectivamente. El siguiente ejemplo lo demuestra:
<SCRIPT Language="JavaScript">
// Aquí va el código de JavaScript.
alert("Hola! Bienvenidos a mi página");//alert("Hola!");
/*Aquí inicia el bloque
Todo lo que vaya dentro del bloque es un comentario.
alert("Hola!");
Fin del bloque.*/
</SCRIPT>
El texto en azul representa el texto que forma parte del comentario; el texto rojo señala el delimitador de comentario.
Cuando escribimos un "bloque" de JavaScript como los hasta ahora mencionados, se van a ejecutar en cuanto sea posible. Sin embargo, nosotros queremos (la mayoría de las veces) que se ejecute cuando nosotros queremos (ej: un botón es presionado). Para ello, declaramos una función:
<SCRIPT Language="JavaScript">
function hola(){
alert("Hola! Bienvenidos a mi página");
}
</SCRIPT>
Es importante notar que el código que corresponde a la función hola() (nombre que cada quien puede asignar a su conveniencia), va encerrado entre corchetes ("{" y "}"). Este código, no se va a ejecutar hasta que nosotros lo deseemos. Para ello, debemos pedir la ejecución de hola(); (Nótese que al mandar llamar la función, se utiliza el punto y coma ";", pero no en la declaración). De esta manera, podemos poner un botón que mande llamar a nuestra función hola();
<FORM>
<INPUT type="button" value="Haz Click" onClick="hola();">
</FORM>
También se puede mandar llamar una función dentro de otra. Por ejemplo:
...
function pregunta(){
if (confirm("Seguro?"))
hola();
}
...
En el ejemplo anterior, se utiliza un condicional (if). Aunque lo voy a cubrir mas adelante, vale la pena mencionar (para aquellos con poca experiencia en programación) que dicho condicional, ejecutará la siguiente instrucción siempre y cuando la condición sea verdadera. En este caso, la condición es el método confirm(); el cual, anteriormente se mencionó que "regresaba" un valor true o false, si se presionaba el botón Ok o Cancel respectivamente.
La siguiente lección mostrará cómo leer los valores y propiedades de las formas desde JavaScript.