Introducción al JavaScript (5)

Ya vimos en su día las funciones y que estas nos permitían reutilizar bloques de código... Pero no es práctico repetir 1000 veces una función. La idea es aprender mecanismos que nos permitan repetir cosas con cabeza... bucles!

for

El bucle for se suele utilizar cuando conocemos o podemos conocer el número de veces que vamos a repetir alguna cosa...

var i;
for (i=0; i<11; i++)
{
document.write(i);
}

Eso nos daría como resultado 012345678910, que no es que sea útil...

La idea es que el bucle for indica su condición inicial, su condición de parada (o de continuidad...) y su variación en el parámetro. En el ejemplo, establecemos una variable de control i que se inicializa a 0 y que, mientras sea menor que 11 hará lo que hemos puesto entre llaves. Tras cada pasada hará i++.

NOTA: i++ es lo mismo que i=i+1 y, en algunos lenguajes, que i+=1. Esto último, lo del i+=1, es el tipo de cosas que cuando las escribo me imagino a alguien diciendo "Noooooooo! Pero que diceeeeees!". Pero bueno, no voy a comprobarlo porque tampoco es que estemos siendo muy técnicos en esta introducción. Lo probáis y si no funciona, me ponéis un comentario pidiendo que os devuelva el dinero... Oh! Wait!... (Vaya día que llevo...)

NOTA: Mua ha ha ha ha! (Thunderclap) Me acabo de dar cuenta de que estoy utilizando el verbo "inicializar" y el corrector no lo reconoce. Pero existe.

while


La otra opción que tenemos es while. Si le damos vueltas, casi todo (por no decir todo) lo que se hace con for se puede hacer con while. La filosofía es distinta. Primero inicializo, luego hago el bucle y dentro del mismo bucle realizo el incremento (o decremento... o gestión) de la variable de control

var i = 0;
while ( i < 11)
{
document.write(i);
i++;
}

Que es equivalente a lo anterior.

NOTA: ¡Aviso a los navegantes! Si no gestionamos bien la variable de control, podemos hacer lo que se llama un bucle infinito, o un bucle del que no podemos salir nunca... jamás... hasta que el ordenador se queda sin memoria o el navegador decide que pasa de nosotros... 

Mañana más... que llevo un día...

Introducción al JavaScript (4)

Las condiciones se basan en el álgebra de Boole. Esto es, en última instancia, la obtención de una respuesta binaria: verdadero o falso. Esta respuesta puede ser el resultado de una comparación o de la operación entra varias comparaciones.

Supongamos la variabla a con el valor 3...

a == 1
a != 1
a > 1
a < 1

NOTA: ¿Cómo se evalúan estos casos? La respuesta es falso, verdadero, verdadero, falso.

¿Y para que vale eso? Pues haciendo las preguntas concretas podemos obtener resultados interesantes.

Detectar el navegador

Pues resulta que en navigator.userAgent tenemos una cadena de texto que identifica el navegador.

alert(navigator.userAgent);

Luego tenemos la opción de poner esa cadena en minúsculas.

alert(navigator.userAgent.toLowerCase());

Y, si le preguntamos a esa cadena ¿en que posición pone "cacatúa"? de este modo...

alert(navigator.userAgent.toLowerCase().indexOf("cacatúa"));

El resultado será el número del carácter donde empieza a poner "cacatúa" o -1 si no existe ese elemento en nuestra cadena.

Condiciones

El tema es que sabemos que la cadena que hemos visto tiene que ser safari, chrome, firefox o msie... Podemos preguntar. La pregunta es si el resultado de la última instancia que hemos puesto es mayor que -1. Si es así, tenemos ese navegador, si no... pues tendremos otro.

Es decir...

if (navigator.userAgent.toLowerCase().indexOf("safari")> -1) document.write("Safari...");

if (navigator.userAgent.toLowerCase().indexOf("chrome")> -1) document.write("Chrome...");

if (navigator.userAgent.toLowerCase().indexOf("firefox")> -1) document.write("Firefox...");

if (navigator.userAgent.toLowerCase().indexOf("msie")> -1) document.write("Vade retro...");

NOTA: El cuadro tendría que mostrar el resultado del código anterior... Al menos a mi me sale "Safari..."

Hay formas más útiles de resolver condiciones múltiples... pero de momento nos sobra con esto. El tema es que si detectamos el tipo de navegador, podemos decidir en tiempo de representación qué archivo de CSS cargar en función del navegador.

NOTA: Si, lo se... hay otras formas... pero si realmente está pensando en eso es que estos tutoriales no son para ti...

Por cierto, antes de que se me olvide. Tras resolver una condición podemos hacer más de una cosa, poniéndolas entre {}

if (navigator.userAgent.toLowerCase().indexOf("msie")> -1)
{
document.write("D'Oh!");
alert("Perotuestassegurodeloqueestáshaciendocontuvidavayahombrepordios!!!");
}

NOTA: Lo del Internet Explorer me viene de la versión 6... si eres usuario del mismo, no te lo tomes como algo personal.

Además, podemos hacer otra cosa... es sacar una información si se cumple la condición y otra si no se cumple.


if (edad<=18)
{
document.write("Puedes pasar...");
}
else
{
document.write("NO puedes pasar...");
}