Taller de Desarrollo Web

JavaScript
Docente: Mitchel Videla Caldern

JavaScript.
El lenguaje Javascript tiene una sintaxis muy parecida a la de Java
por estar basado en l.
Comentarios.
<SCRIPT>
//Este es un comentario de una lnea
/*Este comentario se puede extender
por varias lneas.
Las que quieras*/
</SCRIPT>

JavaScript.

Maysculas y minsculas:
En javascript se han de respetar las maysculas y las minsculas.
Separacin de instrucciones:
Javascript tiene dos maneras de separar instrucciones.
A travs del carcter punto y coma (;) y
A travs de un salto de lnea.

Declaracin de variables

Javascript se salta muchas reglas por ser un lenguaje un tanto libre a

la hora de programar y uno de los casos en los que otorga un poco
de libertad es a la hora de declarar las variables, ya que no estamos
obligados a hacerlo, al contrario de lo que pasa en la mayora de los
lenguajes de programacin. Es aconsejable declarar las variables,
adems de una buena costumbre y para ello Javascript cuenta con la
palabra var:
var operando1
var operando2

Declaracin de variables

Tambin se puede asignar un valor a la variable cuando se est

declarando:
var operando1 = 23
var operando2 = 33
Tambin se permite declarar varias variables en la misma lnea,
siempre que se separen por comas.
var operando1, operando2;

mbito de las variables en Javascript

Variables globales
Las variables globales son las que estn declaradas en el mbito ms
amplio posible, que en Javascript es una pgina web. Para declarar
una variable global a la pgina simplemente lo haremos en un
script, con la palabra var.
<script>
var variableGlobal;
</script>

mbito de las variables en Javascript

Variables locales
Podemos declarar variables en una funcin. A estas variables les
llamaremos locales. Cuando se declaren variables locales slo
podremos acceder a ellas dentro del lugar donde se ha declarado.
<script>
function mifuncion (){
var variableLocal;
}
</script>

mbito de las variables en Javascript

No hay problema en declarar una variable local con el mismo
nombre que una global, en este caso la variable global ser visible
desde toda la pgina, excepto en el mbito donde est declarada la
variable local ya que en este sitio ese nombre de variable est
ocupado por la local y es ella quien tiene validez.
<script>
var numero = 2;
function mifuncion (){
var numero = 19;
document.write(numero); //imprime 19
}
document.write(numero); //imprime 2
</script>

mbito de las variables en Javascript

Diferencias entre utilizar var o no.

En Javascript tenemos libertad para declarar o no las variables con la
palabra var, pero los efectos que conseguiremos en cada caso sern
distintos.
En concreto, cuando utilizamos var estamos haciendo que la
variable que estamos declarando sea local al mbito donde se
declara. Por otro lado, si no utilizamos la palabra var para declarar
una variable, sta ser global a toda la pgina, sea cual sea el
mbito en el que haya sido declarada.

mbito de las variables en Javascript

<script>
var numero = 2;
function mifuncion (){ //se ejecuta slo si se llama
numero = 19;
document.write(numero); //imprime 19
}
document.write(numero); //imprime 2
//llamamos a la funcin
mifuncion();
document.write(numero); //imprime 19
</script>

Variables en JavaScript

Nmeros
Tenemos el tipo numrico, para guardar nmeros como 9 o 23.6
Cadenas
El tipo cadena de carcter guarda un texto. Siempre que escribamos
una cadena de caracteres debemos utilizar las comillas (").

Boleanos
Tambin contamos con el tipo booleano, que guarda una
informacin que puede valer si (true) o no (false).

Variables en JavaScript

Ejemplos:
var nombre_ciudad = "Valencia;
var revisado = true;
nombre_ciudad = 32;
revisado = "no;

Variables en JavaScript

var sumando1 = 23;

var sumando2 = "33;
var suma = sumando1 + sumando2;
document.write(suma);
Este script nos mostrara en la pgina el texto 2333, que no se
corresponde con la suma de los dos nmeros, sino con su
concatenacin, uno detrs del otro.

Caracteres de escape en cadenas de texto

Salto de lnea
Comilla simple
Comilla doble
Tabulador
Retorno de carro
Avance de pgina
Retroceder espacio
Contrabarra

:
:
:
:
:
:
:
:

\n
\'
\"
\t
\r
\f
\b
\\

Operadores Javascript
Operadores aritmticos.
+
Suma de dos valores.
Resta de dos valores, tambin puede utilizarse para cambiar
el signo de un nmero si lo utilizamos con un solo operando
-23
*
Multiplicacin de dos valores
/
Divisin de dos valores
%
El resto de la divisin de dos nmeros (3%2 devolvera 1, el
resto de dividir 3 entre 2)
++
Incremento en una unidad, se utiliza con un solo operando
-Decremento en una unidad, utilizado con un solo operando

Operadores Javascript

Ejemplos
precio = 128; //un 128 en la variable precio
unidades = 10; //otra asignacin
factura = precio * unidades; //multiplica precio por unidades
resto = factura % 3; //el resto de dividir la variable factura por 3
precio++; //incrementa en una unidad el precio (ahora vale 129)

Operadores Javascript

Operadores de asignacin.
=
Asignacin. Asigna la parte de la derecha del igual a la parte
de la izquierda.
+=
Asignacin con suma. Realiza la suma de la parte de la
derecha con la de la izquierda y guarda el resultado en la
parte de la izquierda.
-=
Asignacin con resta
*=
Asignacin de la multiplicacin
/=
Asignacin de la divisin
%=
Se obtiene el resto y se asigna

Operadores Javascript

Ejemplos
ahorros = 7000;
ahorros += 3500;
ahorros /= 2;

//asigna un 7000 a la variable ahorros

//incrementa en 3500 la variable ahorros,
ahora vale 10500
//divide entre 2 mis ahorros, ahora quedan
5250

Operadores Javascript
Operadores de cadenas
Las cadenas de caracteres tambin tienen sus propios operadores
para realizar acciones tpicas sobre cadenas. Aunque javascript slo
tiene un operador para cadenas se pueden realizar otras acciones
con una serie de funciones predefinidas en el lenguaje.
+ Concatena dos cadenas, pega la segunda cadena a continuacin
de la primera.
Ejemplo
cadena1 = "hola
cadena2 = "mundo
cadenaConcatenada = cadena1 + cadena2 //cadena concatenada
vale "holamundo"

Operadores Javascript
miNumero = 23
miCadena1 = "pepe
miCadena2 = "456
resultado1 = miNumero + miCadena1 //resultado1 vale "23pepe
resultado2 = miNumero + miCadena2 //resultado2 vale "23456
miCadena2 += miNumero
//miCadena2 ahora vale
"45623"

Como se puede ver, tambin en el caso del operador +=, si estamos

tratando con cadenas de texto y nmeros entremezclados, tratar a
los dos operadores como si fuesen cadenas

Operadores Javascript

Operadores lgicos
Estos operadores sirven para realizar operaciones lgicas, que son
aquellas que dan como resultado un verdadero o un falso, y se
utilizan para tomar decisiones en los scripts.
!
&&
||

Operador NO o negacin. Si era true pasa a false y viceversa.

Operador Y, si son los dos verdaderos vale verdadero.
Operador O, vale verdadero si por lo menos uno de ellos es
verdadero.

Operadores Javascript

Ejemplo
miBoleano = true
miBoleano = ! miBoleano //miBoleano ahora vale false
tengoHambre = true
tengoComida = true
comoComida = tengoHambre && tengoComida

Operadores Javascript

Operadores condicionales.
==
!=
>
<
>=
<=

Comprueba si dos nmeros son iguales

Comprueba si dos nmeros son distintos
Mayor que, devuelve true si el primer operador es mayor
que el segundo
Menor que, es true cuando el elemento de la izquierda es
menor que el de la derecha
Mayor igual.
Menor igual.

Operadores Javascript

Operadores a nivel de bit.

Se utilizan para efectuar operaciones con ceros y unos.
&
Y de bits.
^
Xor de bits.
|
O de bits.
<<
Shifteo
>>
Shifteo
>>>
Shifteo
>>>= Shifteo
>>=
Shifteo
<<=
Shifteo

Operadores Javascript

Precedencia de los operadores.

() [] .
Sirve para los objetos
! - ++ -Negacin, negativo e incrementos
*/%
Multiplicacin divisin y mdulo
+Suma y resta
<< >> >>>
Cambios a nivel de bit
< <= > >=
Operadores condicionales
== !=
Operadores condicionales de igualdad y desigualdad
&^|
Lgicos a nivel de bit
&& ||
Lgicos booleanos
= += -= *= /= %= <<= >>= >>>= &= ^= != Asignaciones

Operadores Javascript
Ejemplo.
12 * 3 + 4 - 8 / 2 % 3
En este caso primero se ejecutan los operadores * / y %, de
izquierda a derecha, con lo que se realizaran estas operaciones.
Primero la multiplicacin y luego la divisin por estar ms a la
izquierda del mdulo.
36 + 4 - 4 % 3
Ahora el mdulo.
36 + 4 - 1
Por ltimo las sumas y las restas de izquierda a derecha.
40 1 = 39

Estructuras de control

Sintaxis del if
if (expresin) {
acciones a realizar en caso positivo
...
}
if (expresin) {
acciones a realizar en caso positivo
...
} else {
acciones a realizar en caso negativo
}

Estructuras de control
Ejemplo 1.
if (dia == "lunes")
document.write ("Que tengas un feliz comienzo de semana");

Ejemplo 2.
if (credito >= precio) {
document.write("has comprado el artculo " + nuevoArtculo);
carrito += nuevoArticulo;
credito -= precio;
} else {
document.write("se te ha acabado el crdito");
window.location = "carritodelacompra.html;
}

Estructuras de control
Ejemplo 3.
if (edad > 18)
document.write("puedes ver esta pgina para adultos");

Ejemplo 4.
if (bateria == 0 && redElectrica == 0)
document.write("tu ordenador portatil se va a apagar en segundos");

Estructuras de control

Ejemplo 5 - if anidados
var numero1=23
var numero2=63
if (numero1 == numero2){
document.write("Los dos nmeros son iguales")
}else{
if (numero1 > numero2) {
document.write("El primer nmero es mayor que el segundo")
}else{
document.write("El primer nmero es menor que el segundo")
}
}

Estructuras de control

Operador if
Variable = (condicin) ? valor1 : valor2
Ejemplo:
momento = (hora_actual < 12) ? "Antes del medioda" : "Despus del medioda"

Estructuras de control

SWITCH
switch (expresin) {
case valor1:
Sentencias a ejecutar si la expresin tiene como valor a valor1
break
case valor2:
Sentencias a ejecutar si la expresin tiene como valor a valor2
break
case valor3:
Sentencias a ejecutar si la expresin tiene como valor a valor3
break
default:
Sentencias a ejecutar si el valor no es ninguno de los anteriores
}

Estructuras de control

Ejemplo.
switch (dia_de_la_semana) {
case 1:
document.write("Es Lunes")
break
case 2:
document.write("Es Martes")
break
case 3:
document.write("Es Mircoles")
break
case 4:
document.write("Es Jueves")

break
case 5:
document.write("Es viernes")
break
case 6:
case 7:
document.write("Es fin de semana")
break
default:
document.write("Ese da no existe")
}

Estructuras de control

FOR
for (inicializacin; condicin; actualizacin) {
sentencias a ejecutar en cada iteracin
}
Ejemplo 1.
var i
for (i=0; i<=10; i++) {
document.write(i)
}

Estructuras de control

Ejemplo 2.
for (i=1; i<=1000; i+=2)
document.write(i)
Ejemplo 3.
for (i=343; i>=10; i--)
document.write(i)
}

Estructuras de control

Ejemplo 4.
Si deseamos escribir en una pgina web mediante Javascript es lo
siguiente:
<H1>Encabezado de nivel 1</H1>
<H2>Encabezado de nivel 2</H2>
<H3>Encabezado de nivel 3</H3>
<H4>Encabezado de nivel 4</H4>
<H5>Encabezado de nivel 5</H5>
<H6>Encabezado de nivel 6</H6>

Estructuras de control

Respuesta:
for (i=1;i<=6;i++) {
document.write("<H" + i + ">Encabezado de nivel " + i + "</H" + i + ">")
}

Estructuras de control

WHILE
while (condicin){
sentencias a ejecutar
}
Ejemplo.
var color = ""
while (color != "rojo")
color = dame un color //Cdigo no vlido, pide el ingreso de color
}

Estructuras de control

DO WHILE
do {
sentencias del bucle
} while (condicin)
Ejemplo.
var color
do {
color = dame un color
} while (color != "rojo")

Estructuras de control

En este ejemplo vamos a declarar una variable e inicializarla a 0.

Luego iremos sumando a esa variable un nmero aleatorio del 1 al
100 hasta que sumemos 1.000 o ms, imprimiendo el valor de la
variable suma despus de cada operacin. Ser necesario utilizar el
bucle WHILE porque no sabemos exactamente el nmero de
iteraciones que tendremos que realizar.
var suma = 0
while (suma < 1000){
suma += parseInt(Math.random() * 100)
document.write (suma + "<br>")
}

Estructuras de control

Break
Detiene un ciclo. Detener un ciclo significa salir de l y dejarlo todo
como est para continuar con el flujo del programa inmediatamente
despus del bucle.
for (i=0;i<10;i++){
document.write (i)
escribe = dime si contino
if (escribe == "no")
break
}

Estructuras de control

Continue.
Sirve para volver al principio del bucle en cualquier momento, sin
ejecutar las lneas que haya por debajo de la palabra continue.
var i=0
while (i<7){
incrementar = dime si incremento
if (incrementar == "no")
continue
i++
}

Estructuras de control

Ejemplo
Un ejemplo ms prctico sobre estas instrucciones se puede ver a
continuacin. Se trata de un ciclo FOR planeado para llegar hasta
1.000 pero que lo vamos a parar con break cuando lleguemos a 333.
for (i=0;i<=1000;i++){
document.write(i + "<br>")
if (i==333)
break;
}

Estructuras de control

Un ciclo anidado tiene una estructura como la que sigue.

for (i=0;i<10;i++){
for (j=0;j<10;j++) {
document.write(i + "-" + j)
}
}

Estructuras de control

Salida:
0-0
0-1
0-2
0-3
0-4
0-5
0-6
0-7
0-8
0-9

1-0
1-1
1-2
1-3
1-4
1-5
1-6
1-7
1-8
1-9

2-0
2-1
2-2
2-3
2-4
2-5
2-6
2-7
2-8
2-9 . Hasta 9-9

Estructuras de control

Ejemplo.
Imprimir en la pgina las todas las tablas de multiplicar. Del 1 al 9, es
decir, la tabla del 1, la del 2, del 3...
for (i=1;i<10;i++){
document.write("<br><b>La tabla del " + i + ":</b><br>")
for (j=1;j<10;j++) {
document.write(i + " x " + j + ": ")
document.write(i*j)
document.write("<br>")
}
}

Funciones

Cmo se escribe una funcin

Una funcin se debe definir con una sintaxis especial que vamos a
conocer a continuacin.
function nombrefuncion (){
instrucciones de la funcin
...
}

Funciones

Veamos un ejemplo de funcin para escribir en la pgina un

mensaje de bienvenida dentro de etiquetas <H1> para que quede
ms resaltado.
function escribirBienvenida(){
document.write("<H1>Hola a todos</H1>")
}

Funciones

Cmo llamar a una funcin.

NombreDeLaFuncion();

Funciones

Dnde colocamos las funciones.

Podemos colocar las funciones en cualquier parte de la pgina,
siempre entre etiquetas <script>, claro est.
No obstante existe una limitacin a la hora de colocarla con relacin
a los lugares desde donde se la llame. Lo ms normal es colocar la
funcin antes de cualquier llamada a la misma y as seguro que
nunca nos equivocaremos.
En concreto, la funcin se debe definir en el bloque <script> donde
est la llamada a la funcin, aunque es indiferente si la llamada se
encuentra antes o despus la funcin, dentro del mismo bloque
<script>.

Funciones

<script>
miFuncion()
function miFuncion(){
//hago algo...
document.write("Esto va bien")
}
</script>
Este ejemplo funciona correctamente porque la funcin est
declarada en el mismo bloque que su llamada.

Funciones
Tambin es vlido que la funcin se encuentre en un bloque
<script> anterior al bloque donde est la llamada.
<html><head><title>mi pgina</title>
<script>
function miFuncion(){
//hago algo...
document.write("Esto va bien")
}
</script>
</head> <body>
<script>
miFuncion()
</script>
</body> </html>

Funciones

Lo que ser un error es una llamada a una funcin que se encuentra

declarada en un bloque <SCRIPT> posterior.
<script>
miFuncion()
</script>
<script>
function miFuncion(){
//hago algo...
document.write("Esto va bien")
}
</script>

Parmetros de las funciones

Los parmetros se usan para mandar valores a la funcin, con los
que ella trabajar para realizar las acciones. Son los valores de
entrada que recibe una funcin.
Ejemplo:
Una funcin para mostrar un mensaje de bienvenida en la pgina
web, pero al que ahora le vamos a pasar un parmetro que
contendr el nombre de la persona a la que hay que saludar.

function escribirBienvenida(nombre){
document.write("<H1>Hola " + nombre + "</H1>")
}

Parmetros de las funciones

Para llamar a la funcin del ejemplo habra que escribir:
escribirBienvenida(Perico Los Palotes");

Al llamar a la funcin as, el parmetro nombre toma como valor

"Alberto Garca" y al escribir el saludo por pantalla escribir "Hola
Alberto Garca" entre etiquetas <H1>.

Parmetros de las funciones

Mltiples parmetros.
Una funcin puede recibir tantos parmetros como queramos y para
expresarlo se colocan los parmetros separados por comas dentro
de los parntesis.
Ejemplo.
function escribirBienvenida(nombre, colorTexto){
document.write("<FONT color=" + colorTexto + ">)
document.write("<H1>Hola " + nombre + "</H1>")
document.write("</FONT>")
}

Parmetros de las funciones

Llamaramos a la funcin con esta sintaxis. Entre los parntesis
colocaremos los valores de los parmetros.
var miNombre = "Pepe;
var miColor = "red;
escribirBienvenida(miNombre, miColor);

Parmetros de las funciones

Parmetros se pasan por valor.
Los parmetros de las funciones se pasan por valor. Esto quiere
decir que aunque modifiquemos un parmetro en una funcin la
variable original que habamos pasado no cambiar su valor.
function pasoPorValor(miParametro){
miParametro = 32
document.write("he cambiado el valor a 32")
}
var miVariable = 5
pasoPorValor(miVariable)
document.write ("el valor de la variable es: " + miVariable)

Parmetros de las funciones

En el ejemplo tenemos una funcin que recibe un parmetro y que
modifica el valor del parmetro asignndole el valor 32. Tambin
tenemos una variable, que inicializamos a 5 y posteriormente
llamamos a la funcin pasndole esta variable como parmetro.
Como dentro de la funcin modificamos el valor del parmetro
podra pasar que la variable original cambiase de valor, pero como
los parmetros no modifican el valor original de las variables sta no
cambia de valor. De este modo, al imprimir en pantalla el valor de
miVariable se imprimir el nmero 5, que es el valor original de la
variable, en lugar de 32 que era el valor col el que habamos
actualizado el parmetro.

Valores de retorno.

Las funciones tambin pueden retornar valores, de modo que al

ejecutar la funcin se podr realizar acciones y dar un valor como
salida.
Por ejemplo, una funcin que calcula el cuadrado de un nmero
tendr como entrada a ese nmero y como salida tendr el valor
resultante de hallar el cuadrado de ese nmero. Una funcin que
devuelva el da de la semana tendra como salida en da de la
semana.

Valores de retorno.

Ejemplo de funcin que calcula la media de dos nmeros. La funcin

recibir los dos nmeros y retornar el valor de la media.
function media(valor1, valor2){
var resultado;
resultado = (valor1 + valor2) / 2;
return resultado;
}

Valores de retorno.

Para recibir los valores que devuelve una funcin se coloca el

operador de asignacin =.
Para ilustrar esto se puede ver este ejemplo, que llamar a la
funcin media() y guardar el resultado de la media en una variable
para luego imprimirla en la pgina.
var miMedia;
miMedia = media(12, 8);
document.write(miMedia);

Valores de retorno.

Mltiples return.
En una misma funcin podemos colocar ms de un return.
Lgicamente slo vamos a poder retornar una cosa, pero
dependiendo de lo que haya sucedido en la funcin podr ser de un
tipo u otro, con unos datos u otros.
En el siguiente ejemplo, la funcin utiliza mltiples return. Se trata
de una funcin que devuelve un 0 si el parmetro recibido era par y
el valor del parmetro si este era impar.

Valores de retorno.

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

mbito de las variables en funciones.

Dentro de las funciones podemos declarar variables, incluso los

parmetros son como variables que se declaran en la cabecera de la
funcin y que se inicializan al llamar a la funcin. Todas las variables
declaradas en una funcin son locales a esa funcin, es decir, slo
tendrn validez durante la ejecucin de la funcin.
Podemos declarar variables en funciones que tengan el mismo
nombre que una variable global a la pgina. Entonces, dentro de la
funcin la variable que tendr validez es la variable local y fuera de
la funcin tendr validez la variable global a la pgina.

mbito de las variables en funciones.

En cambio, si no declaramos las variables en las funciones se

entender por javascript que estamos haciendo referencia a una
variable global a la pgina, de modo que si no est creada la
variable la crea, pero siempre global a la pgina en lugar de local a la
funcin.

Arrays en Javascript.

En los lenguajes de programacin existen estructuras de datos

especiales que nos sirven para guardar informacin ms compleja
que simples variables. Una estructura tpica en todos los lenguajes
es el Array, que es como una variable donde podemos introducir
varios valores, en lugar de solamente uno como ocurre con la
variables normales.
Los Arrays nos permiten guardar varias variables y acceder a ellas
de manera independiente, es como tener una variable con distintos
compartimentos donde podemos introducir datos distintos. Para
ello utilizamos un ndice que nos permite especificar el
compartimiento o posicin a la que nos estamos refiriendo.

Creacin de Arrays javascript.

El primer paso para utilizar un array es crearlo. Esta es la sentencia

para crear un objeto array:
var miArray = new Array() ;
Esto crea un array en la pgina que esta ejecutndose. El array se
crea sin ningn contenido, es decir, no tendr ninguna casilla o
compartimiento creado. Tambin podemos crear el array
especificando el nmero de compartimentos que va a tener.
var miArray = new Array(10);

Creacin de Arrays javascript.

Es importante que nos fijemos que la palabra Array en cdigo

Javascript se escribe con la primera letra en mayscula. Como en
Javascript las maysculas y minsculas si que importan, si lo
escribimos en minscula no funcionar.

Creacin de Arrays javascript.

Tanto se indique o no el nmero de casillas del Array, podemos

introducir en el Array cualquier dato. Si la casilla est creada se
introduce simplemente y si la casilla no estaba creada se crea y
luego se introduce el dato, con lo que el resultado final es el mismo.
Esta creacin de casillas es dinmica y se produce al mismo tiempo
que los scripts se ejecutan. Veamos a continuacin cmo introducir
valores en los arrays.
miArray[0] = 290;
miArray[1] = 97;
miArray[2] = 127;

Creacin de Arrays javascript.

Se introducen indicando entre corchetes el ndice de la posicin

donde queramos guardar el dato. En este caso introducimos 290 en
la posicin 0, 97 en la posicin 1 y 127 en la 2.
Los Arrays empiezan siempre en la posicin 0, as que un array que
tenga por ejemplo 10 posiciones, tendr casillas de la 0 a la 9.
Para recoger datos de un Array lo hacemos igual: poniendo entre
corchetes el ndice de la posicin a la que queremos acceder.

Creacin de Arrays javascript.

Veamos cmo se imprimira en la pantalla el contenido de un Array.

var miArray = new Array(3);
miArray[0] = 155;
miArray[1] = 4;
miArray[2] = 499;
for (i=0; i<3; i++){
document.write("Posicin " + i + " del array: " + miArray[i]);
document.write("<br>");
}

Tipos de datos en los arrays.

En las casillas de los Arrays podemos guardar datos de cualquier

tipo. Podemos ver un Array donde introducimos datos de tipo
caracter.
miArray[0] = "Hola;
miArray[1] = "a;
miArray[2] = "todos;

Tipos de datos en los arrays.

Incluso, en Javascript podemos guardar distintos tipos de datos en

las casillas de un mismo array. Es decir, podemos introducir nmeros
en unas casillas, textos en otras, booleanos o cualquier otra cosa
que deseemos.
miArray[0] = Perico Los Palotes;
miArray[1] = 1275;
miArray[1] = 0.78;
miArray[2] = true;

Longitud de los arrays.

Todos los arrays en javascript, aparte de almacenar el valor de cada

una de sus posiciones tambin almacenan el nmero de posiciones
que tienen. Para ello utilizan una propiedad del objeto Array, la
propiedad length. Es como una variable, adicional a las posiciones,
que almacena un nmero igual al nmero de casillas del Array.
Para acceder a una propiedad de un objeto se ha de utilizar el
operador punto. Se escribe el nombre del Array que queremos
acceder al nmero de posiciones que tiene, sin corchetes ni
parntesis, seguido de un punto y la palabra length.

Longitud de los arrays.

var miArray = new Array();

miArray[0] = 155;
miArray[1] = 499;
miArray[2] = 65;
document.write("Longitud del array: " + miArray.length);

Este cdigo imprimira en pantalla el nmero de posiciones del

array, que en este caso es 3. Recordamos que un array con 3
posiciones abarca desde la posicin 0 a la 2.

Longitud de los arrays.

Es muy habitual que se utilice la propiedad length para poder

recorrer un Array por todas sus posiciones. Un ejemplo de recorrido
por este array para mostrar sus valores.
for (i=0; i<miArray.length; i++){
document.write(miArray[i])
}

Longitud de los arrays.

Ejemplo, crearemos un array con 2 posiciones y rellenaremos su

valor. Posteriormente introduciremos un valor en la posicin 5 del
array. Finalmente imprimiremos todas las posiciones del array.
var miArray = new Array(2);
miArray[0] = "Colombia;
miArray[1] = "Estados Unidos;
miArray[5] = "Brasil;
for (i=0;i<miArray.length;i++){
document.write("Posicin " + i + " del array: " + miArray[i]);
document.write("<br>");
}

Longitud de los arrays.

Posicin 0 del array: Colombia

Posicin 1 del array: Estados Unidos
Posicin 2 del array: null
Posicin 3 del array: null
Posicin 4 del array: null
Posicin 5 del array: Brasil

Longitud de los arrays.

Se puede ver claramente que el nmero de posiciones es 6, de la 0 a

la 5. Lo que ha ocurrido es que al introducir un dato en la posicin 5,
todas las casillas que no estaban creadas hasta la quinta se crean
tambin.
Las posiciones de la 2 a la 4 estn sin inicializar. En este caso nuestro
navegador ha escrito la palabra null para expresar esto, pero otros
navegadores podrn utilizar la palabra undefined.

Arrays multidimensionales.

Los arrays multidimensionales son un estructuras de datos que

almacenan los valores en ms de una dimensin. Los arrays que
hemos visto hasta ahora almacenan valores en una dimensin, por
eso para acceder a las posiciones utilizamos tan solo un ndice.
Los arrays de 2 dimensiones guardan sus valores, por decirlo de
alguna manera, en filas y columnas y por ello necesitaremos dos
ndices para acceder a cada una de sus posiciones.
Dicho de otro modo, un array multidimensional es como un
contenedor que guardara ms valores para cada posicin, es decir,
como si los elementos del array fueran a su vez otros arrays.

Arrays multidimensionales.

En Javascript no existe un autntico objeto array-multidimensinal.

Para utilizar estas estructuras podremos definir arrays que donde en
cada una de sus posiciones habr otro array.
En nuestros programas podremos utilizar arrays de cualquier
dimensin, veremos a continuacin cmo trabajar con arrays de dos
dimensiones, que sern los ms comunes.

Arrays multidimensionales.

En este ejemplo vamos a crear un array de dos dimensiones donde

tendremos por un lado ciudades y por el otro la temperatura media
que hace en cada una durante de los meses de invierno.
var temperaturas_medias_ciudad0 = new Array(3);
temperaturas_medias_ciudad0[0] = 12;
temperaturas_medias_ciudad0[1] = 10;
temperaturas_medias_ciudad0[2] = 11;

Arrays multidimensionales.

var temperaturas_medias_ciudad1 = new Array (3);

temperaturas_medias_ciudad1[0] = 5;
temperaturas_medias_ciudad1[1] = 0;
temperaturas_medias_ciudad1[2] = 2;
var temperaturas_medias_ciudad2 = new Array (3);
temperaturas_medias_ciudad2[0] = 10;
temperaturas_medias_ciudad2[1] = 8:
temperaturas_medias_ciudad2[2] = 10;

Arrays multidimensionales.

Con las anteriores lneas hemos creado tres arrays de 1 dimensin y

tres elementos, como los que ya conocamos. Ahora crearemos un
nuevo array de tres elementos e introduciremos dentro de cada una
de sus casillas los arrays creados anteriormente, con lo que
tendremos un array de arrays, es decir, un array de 2 dimensiones.
var temperaturas_cuidades = new Array (3);
temperaturas_cuidades[0] = temperaturas_medias_ciudad0;
temperaturas_cuidades[1] = temperaturas_medias_ciudad1;
temperaturas_cuidades[2] = temperaturas_medias_ciudad2;

Arrays multidimensionales.

Vemos que para introducir el array entero hacemos referencia al

mismo sin parntesis ni corchetes, sino slo con su nombre. El array
temperaturas_cuidades es nuestro array bidimensinal.
Tambin es interesante ver cmo se realiza un recorrido por un
array de dos dimensiones. Para ello tenemos que hacer un recorrido
por cada una de las casillas del array bidimensional y dentro de
stas hacer un nuevo recorrido para cada una de sus casillas
internas. Es decir, un recorrido por un array dentro de otro.

Arrays multidimensionales.

El mtodo para hacer un recorrido dentro de otro es colocar un

bucle dentro de otro, lo que se llama un bucle anidado. Puede
resultar complicado el hacer un bucle anidado. As que en este
ejemplo vamos a meter un bucle FOR dentro de otro. Adems,
vamos a escribir los resultados en una tabla, lo que complicar un
poco el script, pero podremos ver cmo construir una tabla desde
javascript a medida que realizamos el recorrido anidado al bucle.

Arrays multidimensionales.
document.write("<table width=200 border=1 cellpadding=1 cellspacing=1>");
for (i=0; i<temperaturas_cuidades.length; i++){
document.write("<tr>");
document.write("<td><b>Ciudad " + i + "</b></td>");
for (j=0; j<temperaturas_cuidades[i].length; j++){
document.write("<td>" + temperaturas_cuidades[i][j] + "</td>");
}
document.write("</tr>");
}
document.write("</table>");

Inicializacin de arrays.

El mtodo normal de crear un array es a travs del objeto Array,

poniendo entre parntesis el nmero de casillas del array o no
poniendo nada, de modo que el array se crea sin ninguna posicin.
Para introducir valores a un array se hace igual, pero poniendo
entre los parntesis los valores con los que deseamos rellenar las
casillas separados por coma. Vemoslo con un ejemplo que crea un
array con los nombres de los das de la semana.
var diasSemana;
diasSemana = new Array("Lunes","Martes","Mircoles","Jueves","Viernes","Sbado","Domingo");

Inicializacin de arrays.

El array se crea con 7 casillas, de la 0 a la 6 y en cada casilla se

escribe el dia de la semana correspondiente (Entre comillas porque
es un texto).
Ahora vamos a ver algo ms complicado, se trata de declarar el
array bidimensional que utilizamos antes para las temperaturas de
las ciudades en los meses en una sola lnea, introduciendo los
valores a la vez.
var temperaturas_cuidades = new Array(new Array (12,10,11), new Array(5,0,2), new Array(10,8,10));

En el ejemplo introducimos en cada casilla del array otro array que

tiene como valores las temperaturas de una ciudad en cada mes.

Depurar errores en Javascript.

Cualquier programa es susceptible de contener errores. javascript

nos informar de muchos de los errores de la pgina: los que tienen
relacin con la sintaxis y los que tienen lugar en el momento de la
ejecucin de los scripts a causa de equivocarnos al escribir el
nombre de una funcin o una variable. Sin embargo, no son los
nicos errores que nos podemos encontrar, tambin estn los
errores que ocurren sin que javascript muestre el correspondiente
mensaje de error.

Depurar errores en Javascript.

Con la funcin alert() podemos mostrar en cualquier momento el

contenido de las variables que estamos utilizando en nuestros
scripts.
var n_actual = 0;
var suma = 0;
while (suma<300){
n_actual ++;
suma += suma + n_actual;
alert("n_actual vale " + n_actual + " y suma vale " + suma);
}

Funciones de Javascript.

Funcin eval.
var miTexto = "3 + 5"
eval("document.write(" + miTexto +")")
La funcin eval nos queda:
document.write(3 + 5)
La funcin eval ejecuta la instruccin que se le pasa por parmetro,
as que ejecutar esta sentencia, lo que dar como resultado que se
escriba un 8 en la pgina web. Primero se resuelve la suma que hay
entre parntesis, con lo que obtenemos el 8 y luego se ejecuta la
instruccin de escribir en pantalla.

Funciones de Javascript.

Funcin parseInt.
Esta funcin recibe un nmero, escrito como una cadena de
caracteres, y un nmero que indica una base.
document.write (parseInt("34"))
Devuelve el numero 34
document.write (parseInt("101011",2))
Devuelve el numero 43
document.write (parseInt("34",8))
Devuelve el numero 28

Funciones de Javascript.

document.write (parseInt("3F",16))
Devuelve el numero 63
Esta funcin se utiliza en la prctica para un montn de cosas
distintas en el manejo con nmeros, por ejemplo obtener la parte
entera de un decimal.
document.write (parseInt("3.38"))
Devuelve el numero 3

Funciones de Javascript.

Tambin es muy habitual su uso para saber si una variable es

numrica, pues si le pasamos un texto a la funcin que no sea
numrico nos devolver NaN (Not a Number) lo que quiere decir
que No es un Nmero.
document.write (parseInt(Perico Los Palotes"))
Devuelve el numero NaN

Funciones de Javascript.

Este mismo ejemplo es interesante con una modificacin, pues si le

pasamos una combinacin de letras y nmeros nos dar lo
siguiente.
document.write (parseInt("16XX3U"))
Devuelve el numero 16
document.write (parseInt("TG45"))
Devuelve el numero NaN
Como se puede ver, la funcin intenta convertir el string en nmero
y si no puede devuelve NaN.

Funciones de Javascript.

Funcin isNaN
Esta funcin devuelve un booleano dependiendo de si lo que recibe
es un nmero o no. Lo nico que puede recibir es un nmero o la
expresin NaN. Si recibe un NaN devuelve true y si recibe un
nmero devuelve false.
La funcin suele trabajar en combinacin con la funcin parseInt o
parseFloat, para saber si lo que devuelven estas dos funciones es
un nmero o no.

Funciones de Javascript.

miInteger = parseInt("A3.6")
isNaN(miInteger)
En la primera lnea asignamos a la variable miInteger el resultado
de intentar convertir a entero el texto A3.6. Como este texto no se
puede convertir a nmero la funcin parseInt devuelve NaN. La
segunda lnea comprueba si la variable anterior es NaN y como si lo
es devuelve un true.

Funciones de Javascript.

miFloat = parseFloat("4.7")
isNaN(miFloat)
En este ejemplo convertimos un texto a nmero con decimales. El
texto se convierte perfectamente porque corresponde con un
nmero. Al recibir un nmero la funcin isNaN devuelve un false.

Objetos.

Cmo instanciar objetos

Instanciar un objeto es la accin de crear un ejemplar de una clase
para poder trabajar con l luego. Recordamos que un objeto se crea
a partir de una clase y la clase es la definicin de las caractersticas
y funcionalidades de un objeto. Con las clases no se trabaja, estas
slo son definiciones, para trabajar con una clase debemos tener
un objeto instanciado de esa clase.
En javascript para crear un objeto a partir de una clase se utiliza la
instruccin new, de esta manera.
var miObjeto = new miClase();

Cmo acceder a propiedades y mtodos de los objetos.

En Javascript podemos acceder a las propiedades y mtodos de

objetos de forma similar a como se hace en otros lenguajes de
programacin, con el operador punto (".").
Las propiedades se acceden colocando el nombre del objeto
seguido de un punto y el nombre de la propiedad que se desea
acceder.
De esta manera:
miObjeto.miPropiedad

Cmo acceder a propiedades y mtodos de los objetos.

Para llamar a los mtodos utilizamos una sintaxis similar pero

poniendo al final entre parntesis los parmetros que pasamos a
los mtodos. Del siguiente modo:
miObjeto.miMetodo(parametro1,parametro2);
Si el mtodo no recibe parmetros colocamos los parntesis
tambin, pero sin nada dentro.
miObjeto.miMetodo()

Clase String

Propiedades de String
Length: guarda el nmero de caracteres del String.
Mtodos de String:
Los objetos de la clase String tienen una buena cantidad de
mtodos para realizar muchas cosas interesantes. Primero vamos a
ver una lista de los mtodos ms interesantes y luego vamos a ver
otra lista de mtodos menos tiles.
charAt(indice). Devuelve el carcter que hay en la posicin
indicada como ndice. Las posiciones de un string empiezan en 0.

Clase String

indexOf(carcter,desde)
Devuelve la posicin de la primera vez que aparece el carcter
indicado por parmetro en un String. Si no encuentra el carcter en
el String devuelve -1. El segundo parmetro es opcional y sirve para
indicar a partir de que posicin se desea que empiece la bsqueda.
lastIndexOf(carcter,desde)
Busca la posicin de un carcter exactamente igual a como lo hace
la funcin indexOf pero desde el final en lugar del principio. El
segundo parmetro indica el nmero de caracteres desde donde se
busca, igual que en indexOf.

Clase String

replace(substring_a_buscar,nuevoStr)
Sirve para reemplazar porciones del texto de un string por otro
texto, por ejemplo, podramos uilizarlo para reemplazar todas las
apariciones del substring "xxx" por "yyy". El mtodo no reemplaza
en el string, sino que devuelve un resultante de hacer ese
reemplazo. Acepta expresiones regulares como substring a buscar.
split(separador)
Sirve para crear un vector a partir de un String en el que cada
elemento es la parte del String que est separada por el separador
indicado por parmetro.

Clase String

substring(inicio,fin)
Devuelve el substring que empieza en el carcter de inicio y
termina en el carcter de fin. Si intercambiamos los parmetros de
inicio y fin tambin funciona. Simplemente nos da el substring que
hay entre el carcter menor y el mayor.
toLowerCase()
Pone todas los caracteres de un string en minsculas.
toUpperCase()
Pone todas los caracteres de un string en maysculas.

Clase String

toString()
Este mtodo lo tienen todos los objetos y se usa para convertirlos
en cadenas.

Clase String

Ejemplo 1.
Vamos a escribir el contenido de un String con un caracter
separador ("-") entre cada uno de los caracteres del string.
var miString = "Hola Amigos
var result = "
for (i=0; i<miString.length-1; i++) {
result += miString.charAt(i);
result += "-";
}
result += miString.charAt(miString.length - 1);
document.write(result);

Clase String

Ejemplo 2.
Script que rompe un string en dos mitades y las imprima por
pantalla. Las mitades sern iguales, siempre que el string tenga un
nmero de caracteres par. En caso de que el nmero de caracteres
sea impar no se podr hacer la mitad exacta, pero partiremos el
string lo ms aproximado a la mitad.
var miString = "0123456789;
var mitad1,mitad2;
posicion_mitad = miString.length / 2;
mitad1 = miString.substring(0,posicion_mitad);
mitad2 = miString.substring(posicion_mitad, miString.length);
document.write(mitad1 + "<br>" + mitad2);

Clase Date

Sobre este objeto recae todo el trabajo con fechas en Javascript,

como obtener una fecha, el da la hora y otras cosas. Para trabajar
con fechas necesitamos instanciar un objeto de la clase Date y con
l ya podemos realizar las operaciones que necesitemos.
Un objeto de la clase Date se puede crear de dos maneras distintas.
Por un lado podemos crear el objeto con el da y hora actuales y
por otro podemos crearlo con un da y hora distintos a los actuales.
Esto depende de los parmetros que pasemos al construir los
objetos.

Clase Date

Para crear un objeto fecha con el da y hora actuales colocamos los

parntesis vacos al llamar al constructor de la clase Date.
miFecha = new Date();
Para crear un objeto fecha con un da y hora distintos de los
actuales tenemos que indicar entre parntesis el momento con que
inicializar el objeto. Hay varias maneras de expresar un da y hora
vlidas, por eso podemos construir una fecha guindonos por
varios esquemas. Estos son dos de ellos, suficientes para crear todo
tipo de fechas y horas.

Clase Date

miFecha = new Date(ao,mes,dia,hora,minutos,segundos);

miFecha = new Date(ao,mes,dia);
Los valores que debe recibir el constructor son siempre numricos.
Un detalle, el mes comienza por 0, es decir, enero es el mes 0.
Si no indicamos la hora, el objeto fecha se crea con hora 00:00:00.

Clase Date

Los objetos de la clase Date no tienen propiedades pero si un

montn de mtodos, vamos a verlos ahora.
getDate()
Devuelve el da del mes.
getDay()
Devuelve el da de la semana.
getHours()
Retorna la hora..

Clase Date
getMinutes()
Devuelve los minutos.
getMonth()
Devuelve el mes (atencin al mes que empieza por 0).
getSeconds()
Devuelve los segundos.

getTime()
Devuelve los milisegundos transcurridos entre el da 1 de enero de
1970 y la fecha correspondiente al objeto al que se le pasa el
mensaje.

Clase Date
getYear()
Retorna el ao, al que se le ha restado 1900. Por ejemplo, para el
1995 retorna 95, para el 2005 retorna 105. Este mtodo est
obsoleto en Netscape a partir de la versin 1.3 de Javascript y ahora
se utiliza getFullYear().
getFullYear()
Retorna el ao con todos los dgitos. Usar este mtodo para estar
seguros de que funcionar todo bien en fechas posteriores al ao
2000.

Clase Date
setDate()
Actualiza el da del mes.
setHours()
Actualiza la hora.
setMinutes()
Cambia los minutos.
setMonth()
Cambia el mes (atencin al mes que empieza por 0).

Clase Date
setSeconds()
Cambia los segundos.
setTime()
Actualiza la fecha completa. Recibe un nmero de milisegundos
desde el 1 de enero de 1970.
setYear()
Cambia el ao recibe un nmero, al que le suma 1900 antes de
colocarlo como ao de la fecha. Por ejemplo, si recibe 95 colocar
el ao 1995. Este mtodo est obsoleto a partir de Javascript 1.3 en
Netscape. Ahora se utiliza setFullYear(), indicando el ao con todos
los dgitos.

Clase Date

setFullYear()
Cambia el ao de la fecha al nmero que recibe por parmetro. El
nmero se indica completo ej: 2005 o 1995. Utilizar este mtodo
para estar seguros que todo funciona para fechas posteriores a
2000.

Clase Date

En este ejemplo vamos a crear dos fechas, una con el instante

actual y otra con fecha del pasado. Luego las imprimiremos las dos
y extraeremos su ao para imprimirlo tambin. Luego
actualizaremos el ao de una de las fechas y la volveremos a
escribir con un formato ms legible.
//en estas lneas creamos las fechas
miFechaActual = new Date()
miFechaPasada = new Date(1998,4,23)

Clase Date

//en estas lneas imprimimos las fechas.

document.write (miFechaActual)
document.write ("<br>")
document.write (miFechaPasada)
//extraemos el ao de las dos fechas
anoActual = miFechaActual.getFullYear()
anoPasado = miFechaPasada.getFullYear()

Clase Date

//Escribimos en ao en la pgina
document.write("<br>El ao actual es: " + anoActual)
document.write("<br>El ao pasado es: " + anoPasado)
//cambiamos el ao en la fecha actual
miFechaActual.setFullYear(2005)

Clase Date

//extraemos el da mes y ao
dia = miFechaActual.getDate()
mes = parseInt(miFechaActual.getMonth()) + 1
ano = miFechaActual.getFullYear()
//escribimos la fecha en un formato legible
document.write ("<br>")
document.write (dia + "/" + mes + "/" + ano)

Clase Math

Las propiedades guardan valores que probablemente necesitemos

en algn momento si estamos haciendo clculos matemticos. Es
probable que estas propiedades resulten un poco raras a las
personas que desconocen las matemticas avanzadas, pero los que
las conozcan sabrn de su utilidad.
E
Nmero E o constante de Euler, la base de los logaritmos
neperianos.

Clase Math

LN2
Logaritmo neperiano de 2.
LN10
Logaritmo neperiano de 10.
LOG2E
Logaritmo en base 2 de E.
LOG10E
Logaritmo en base 10 de E.

Clase Math

PI
Conocido nmero para clculo con crculos.
SQRT1_2
Raiz cuadrada de un medio.
SQRT2
Raiz cuadrada de 2.

Clase Math

Mtodos de Math.
As mismo, tenemos una serie de mtodos para realizar
operaciones matemticas tpicas, aunque un poco complejas. Todos
los que conozcan las matemticas a un buen nivel conocern el
significado de estas operaciones.
abs()
Devuelve el valor absoluto de un nmero. El valor despus de
quitarle el signo.

Clase Math

acos()
Devuelve el arcocoseno de un nmero en radianes.
asin()
Devuelve el arcoseno de un nmero en radianes.
atan()
Devuelve un arcotangente de un nmero.

Clase Math

ceil()
Devuelve el entero igual o inmediatamente siguiente de un
nmero. Por ejemplo, ceil(3) vale 3, ceil(3.4) es 4.
cos()
Retorna el coseno de un nmero.
exp()
Retorna el resultado de elevar el nmero E por un nmero.

Clase Math

floor()
Lo contrario de ceil(), devuelve un nmero igual o inmediatamente
inferior.
log()
Devuelve el logaritmo neperiano de un nmero.
max()
Retorna el mayor de 2 nmeros.
min()
Retorna el menor de 2 nmeros.

Clase Math

pow()
Recibe dos nmeros como parmetros y devuelve el primer
nmero elevado al segundo nmero.
random()
Devuelve un nmero aleatorio entre 0 y 1. Mtodo creado a partir
de Javascript 1.1.
round()
Redondea al entero ms prximo.

Clase Math

sin()
Devuelve el seno de un nmero con un ngulo en radianes.
sqrt()
Retorna la raz cuadrada de un nmero.
tan()
Calcula y devuelve la tangente de un nmero en radianes.

Clase Math

Ejemplo de utilizacin de la clase Math

Vamos a ver un sencillo ejemplo sobre cmo utilizar mtodos y
propiedades de la clase Math para calcular el seno y el coseno de 2
PI radianes (una vuelta completa). Como se sabe, el coseno de 2 PI
radianes debe dar como resultado 1 y el seno 0.
document.write (Math.cos(2 * Math.PI))
document.write ("<br>")
document.write (Math.sin(2 * Math.PI))

Clases definidas por el usuario

Para crear una clase en Javascript debemos escribir una funcin

especial, que se encargar de construir el objeto en memoria e
inicializarlo. Esta funcin se le llama constructor en la terminologa
de la programacin orientada a objetos.
function MiClase (valor_inicializacion){
//Inicializacin de las propiedades y mtodos
this.miPropiedad = valor_inicializacion
this.miMetodo = nombre_de_una_funcion_definida
}

Clases definidas por el usuario

Eso era un constructor. Utiliza la palabra this para declarar las

propiedades y mtodos del objeto que se est construyendo. this
hace referencia al objeto que se est construyendo, pues
recordemos que a esta funcin la llamaremos para construir un
objeto. A ese objeto que se est construyendo le vamos asignando
valores en sus propiedades y tambin le vamos asignando nombres
de funciones definidas para sus mtodos. Al construir un objeto
tcnicamente es lo mismo declarar una propiedad o un mtodo,
solo difiere en que a una propiedad le asignamos un valor y a un
mtodo le asignamos una funcin.

La clase AlumnoUniversitario.
En este ejemplo vamos a crear un objeto estudiante universitario.
Como estudiante tendr unas caractersticas como el nombre, la
edad y el nmero de matrcula. Adems podr tener algn mtodo
como por ejemplo matricular al alumno.

Constructor: Colocamos propiedades.

Veamos cmo definir el constructor de la clase
Alumnouniversitario, pero solamente vamos a colocar por ahora
las propiedades de la clase.

La clase AlumnoUniversitario.

function AlumnoUniversitario(nombre, edad){

this.nombre = nombre
this.edad = edad
this.numMatricula = null
}
Los valores de inicializacin los recibe el constructor como
parmetros, en este caso es slo el nombre y la edad, porque el
nmero de matrcula no lo recibe un alumno hasta que es
matriculado. Es por ello que asignamos a null la propiedad
numMatrcula.

La clase AlumnoUniversitario.
Para construir un mtodo debemos crear una funcin. Una funcin
que se construye con intencin de que sea un mtodo para una
clase, puede utilizar tambin la variable this, que hace referencia al
objeto sobre el que invocamos el mtodo.

function matricular(num_matricula){
this.numMatricula = num_matricula
}
La funcin matricular recibe un nmero de matrcula por
parmetro y lo asigna a la propiedad numMatricula del objeto que
recibe este mtodo. As rellenamos el la propiedad del objeto que
nos faltaba.

La clase AlumnoUniversitario.
Vamos a construir otro mtodo que imprime los datos del alumno.
function imprimir(){
document.write("Nombre: " + this.nombre)
document.write("<br>Edad: " + this.edad)
document.write("<br>Nmero de matrcula: " + this.numMatricula)

}
Esta funcin va imprimiendo todas las propiedades del objeto que
recibe el mtodo.

La clase AlumnoUniversitario.
Constructor: Para colocar un mtodo en una clase debemos asignar
la funcin que queremos que sea el mtodo al objeto que se est
creando. Veamos cmo quedara el constructor de la clase
AlumnoUniversitario con el mtodo matricular.

function AlumnoUniversitario(nombre, edad){

this.nombre = nombre
this.edad = edad
this.numMatricula = null
this.matricular = matricular
this.imprimir = imprimir
}

La clase AlumnoUniversitario.

Para instanciar un objeto.

Para instanciar objetos de la clase AlumnoUniversitario se utiliza la
sentencia new.
miAlumno = new AlumnoUniversitario("Jos Daz",23)

La clase AlumnoUniversitario.
Invocando los mtodos de la clase:
//le pedimos que se imprima
miAlumno.imprimir()

//le pedimos que se matricule

miAlumno.matricular(305)
//le pedimos que se imprima con el nmero de matricula asignado
miAlumno.imprimir()

Manipulacin de objetos de un formulario

Para acceder a un formulario desde el objeto document podemos

hacerlo de dos formas. A partir de su nombre, asignado con el
atributo NAME de HTML. Mediante la matriz de formularios del
objeto document, con el ndice del formulario al que queremos
acceder.
Para este formulario:
<FORM name="f1">
<INPUT type=text name=campo1>
<INPUT type=text name=campo2>
</FORM>

Manipulacin de objetos de un formulario

Podremos acceder con su nombre de esta manera.

document.f1

O con su ndice, si suponemos que es el primer formulario de la

pgina.
document.forms[0]

Manipulacin de objetos de un formulario

Podramos acceder al campo 1 del anterior formulario de dos

maneras. Con su nombre lo haramos as.
document.f1.campo1
o a partir del array de elementos.
document.f1.elements[0] (utilizamos el ndice 0 porque es el
primer elemento y en Javascript los arrays empiezan por 0)

Manipulacin de objetos de un formulario

Si deseamos acceder al segundo campo del formulario

escribiramos una de estas dos cosas:
document.f1.campo2
document.f1.elements[1]
Recordemos que tambin podemos acceder a un formulario por el
array de forms, indicando el ndice del formulario al que acceder.
De este modo, el acceso al campo2 sera el siguiente:
document.forms[0].campo2
document.forms[0].elements[1]

Ejemplo calculadora sencilla.

En este ejemplo vamos a construir una calculadora, aunque

bastante sencilla, que permita realizar las operaciones bsicas.
Para hacer la calculadora vamos a realizar un formulario en el que
vamos a colocar tres campos de texto, los dos primeros para los
operandos y un tercero para el resultado. Adems, habrn unos
botones para hacer las operaciones bsicas.

Ejemplo calculadora sencilla.

<form name="calc">
<input type="Text" name="operando1" value="0" size="12">
<br>
<input type="Text" name="operando2" value="0" size="12">
<br>
<input type="Button" name="" value=" + " onclick="calcula('+')">
<input type="Button" name="" value=" - " onclick="calcula('-')">
<input type="Button" name="" value=" X " onclick="calcula('*')">
<input type="Button" name="" value=" / " onclick="calcula('/')">
<br>
<input type="Text" name="resultado" value="0" size="12">
</form>

Ejemplo calculadora sencilla.

El script con la funcin calcula()

<script>
function calcula(operacion){
var operando1 = document.calc.operando1.value
var operando2 = document.calc.operando2.value
var result = eval(operando1 + operacion + operando2)
document.calc.resultado.value = result
}
</script>

Envo de formularios.

Podemos condicionar el envo de un formulario, como por ejemplo,

para realizar validaciones previas.
<input type=button onclick="pregunta()" value="Enviar">
.
<script>
function pregunta(){
if (confirm('Estas seguro de enviar este formulario?')){
document.tuformulario.submit()
}
}
</script>