JavaScript

Avanzado
Ramiro Estigarribia Canese
Comandos tiles
Ir una pgina hacia atrs:
<input type=button value=Atras onclick=window.history.go(-1)>

Imprimir una pgina:
<input type=button value=Imprimir onclick=window.print();>

Redireccionar a otra pgina:
<input type=button
onClick=window.location="http://www.abc.com.py"
value=Boton1>

Estructura repetitiva for
Cualquier problema que requiera una estructura
repetitiva se puede resolver empleando la estructura
while.

La estructura for es ms prctica en algunas situaciones.

Sintaxis:
for (<Inicio> ; <Condicin> ; <Incremento>)
{
<Instrucciones>
}

Mostrar nmeros.
Del 50 al 60
<script>
var f;
for(f=50;f<=60;f++)
{
document.write(f+" ");
}
</script>

Funciones
En programacin es muy frecuente que un
procedimiento de clculo tenga que repetirse varias
veces, lo cual implica que se tenga que escribir tantos
grupos de aquellas sentencias como veces aparezca
dicho proceso.
La herramienta ms potente con que se cuenta para
facilitar, reducir y dividir el trabajo, es escribir aquellos
grupos de sentencias una sola y nica vez en forma
de funcin.
Funcin: Mostrar Nmero
entre 2 valores.
<script>
function mostrarComprendidos(x1,x2)
{
var inicio;
for(inicio=x1;inicio<=x2;inicio++)
{
document.write(inicio+' ');
}
}
valor1=prompt('Ingrese valor inferior:','');
valor2=prompt('Ingrese valor superior:','');
mostrarComprendidos(valor1,valor2);
</script>

Funcin que recibe:
2 nmeros y retorna el mayor.
<script>
function retornarMayor(x1,x2)
{
if (x1>x2)
{ return x1; }
else
{ return x2; }
}
valor1=prompt('Ingrese primer valor:','');
valor2=prompt('Ingrese segundo valor:','');
may=retornarMayor(valor1,valor2);document.write('El mayor
es :'+may);
</script>

Operadores lgicos: && (y)
|| (o)
El operador &&, se lo lee como "Y".
Se emplea cuando en una estructura condicional se
disponen dos condiciones, y las dos condiciones
deben ser verdaderas.

El operador ||, se lee como "O"
Con que una de las dos condiciones sea Verdadera
alcanza para que el resultado de la condicin
compuesta sea Verdadero.
Ejemplo
Comprobar trimestre
<script>
dia=prompt('Ingrese da:','');
mes=prompt('Ingrese mes:','');

if (mes==1 || mes==2 || mes==3)
{
document.write('corresponde al primer trimestre.');
}
</script>

Funcin: Verificar el botn
presionado.
<meta charset=UTF-8>
<script>
function presion1()
{ alert('Se presion el botn 1'); }
function presion2()
{ alert('Se presion el botn 2'); }
function presion3()
{ alert('Se presion el botn 3'); }
</script><form>
<input type=button onClick=presion1() value=Boton1>
<input type=button onClick=presion2() value=Boton2>
<input type=button onClick=presion3() value=Boton3></form>

Archivo JavaScript externo .js
El lenguaje JavaScript permite agrupar funciones y
disponerlas en un archivo separado a la pgina HTML.

Esto trae ventajas:
1. Reutilizacin de funciones en muchos archivos. No
tenemos que copiar y pegar sucesivamente las
funciones en las pginas en las que necesitamos.
2. Facilita el mantenimiento de las funciones al
encontrarse en archivos separados.
3. Nos obliga a ser ms ordenados.

Ejemplo:
<script src=funciones.js></script>
Acceder a la Camara
HTML5 + Javascript
Hasta hace poco la nica forma de acceder a la
cmara web por medio de extensiones especficas
para el navegador. (solo en Windows).

La llegada del HTML5 ha ocasionado un aumento del
acceso a dispositivos de hardware.

La geolocalizacin (GPS), el API de orientacin
(acelermetro), WebGL (GPU) y el API de audio web
(hardware de audio) son ejemplos perfectos.
Acceder a la Camara
HTML5 + Javascript
<script src=jquery-1.8.3.js></script><script
src=camara.js></script><input id=botonIniciar type=button
value=Iniciar></input><br><input id=botonDetener type=button
value=Detener></input><br><input id=botonFoto type=button
value=Foto></input><br><video id=camara autoplay
controls></video><br><br><canvas id=foto></canvas>

Acceder a la Camara
HTML5 + Javascript
Ejercicios
1. Realizar un programa que muestre la tabla de multiplicar del
5 (del 5 al 50).
2. Realizar un programa que lea los lados de 1 tringulo, e
informar: Qu tipo de tringulo es: equiltero (tres lados
iguales), issceles (dos lados iguales), o escaleno (ningn
lado igual)?
3. Elaborar una funcin a la cual le enviemos tres nmeros
enteros y muestre el menor.
4. Realizar un programa que pida cargar una fecha cualquiera
(dia y mes por separado). Luego verificar si dicha fecha
corresponde a Navidad.