2. INTRODUCCIN AL LENGUAJE JAVASCRIPT.

Javascript es un lenguaje de programacin interpretado que se utiliza fundamentalmente para dotar

de comportamiento dinmico a las pginas web. Por ello, cualquier navegador actual incorpora un
intrprete para cdigo Javascript.
El primer lenguaje de scripting para la Web fue LiveScript desarrollado por Netscape para
proporcionar una alternativa "ligera" a Java a la hora de soportar comportamiento dinmico tanto
en el lado del servidor como en el del cliente. Posteriormente LiveScript paso a denominarse
Javascript, el xito de Javascript provoc que incluso cuando ya exista Vbscript, otro lenguaje de
scripting para la Web basado en BASIC, Microsoft lanzase su propia versin de Javascript,
denominada Jscript e integrada en sus navegadores a partir de Internet Explorer 3.
A pesar de que las diferencias ente Javascript y Jscript no fueran muy grandes, el hecho de que
cada navegador soportase su propio lenguaje obligaba a veces a los desarrolladores a programar dos
veces la misma funcionalidad (una con cada lenguaje) e introducir en sus pginas web sentencias
condicionales para distinguir en qu navegador se estaba ejecutando la pgina e invocar la ejecucin
del cdigo escrito con el lenguaje soportado por el navegador en cuestin.
En respuesta a este tipo de problemas la ECMA (European Computer Manufactures
Association) emprendi un esfuerzo de estandarizacin que desemboc en la publicacin del
estndar ECMAScript. Aunque hoy en da, tanto Javascript como Jscript son conformes a dicho
standar, es el trmino Javascript el que se impuso y se utiliza como denominador comn para
referirse al propio lenguaje y al estndar.
Algunas de las caractersiticas ms destacadas de este lenguaje son:

La sintaxis de Javascript se asemeja a la de C++ y la de Java. Javascript est basado en el

concepto de objeto, pero no es un lenguje orientado a objetos.

Los objetos Javascript utilizan herencia basada en prototipos, muy diferente de la herencia
basada en clases propia de los lenguajes orientados a objetos, como Java. En Javascript los
objetos heredan propiedades directamente de otros objetos sin necesidad de que sean
instancias de una misma clase.

Es un lenguaje dbilmente tipado, lo que permite que una variable pueda contener valores
de distintos tipos en diferentes momentos de la ejecucin del programa. Esto presenta como
principal inconveniente que muchos errores de programacin no aparecen hasta que el
programa es ejecutado, ya que el compilador es incapaz de detectarlos.

Para empezar a realizar programas en Javascript, solo necesitamos un explorador web y un editor
de textos, no necesitamos descargar ningn software especial para empezar a experimentar con
Javascript.
Para ejecutar cualquier programa Javascript tenemos que embeber el cdigo Javascript en una
pgina HTML de la misma forma que insertamos cualquier otro contenido HTML: utilizando
etiquetas para marcar el principio y el fin del bloque de cdigo Javascript. En este caso utilizamos la
etiqueta <script></script>.

De esta forma el navegador sabe que el bloque de texto contenido entre la etiqueta de inicio y fin no
se corresponde con cdigo HTML, si no que se trata de cdigo que debe ser procesado antes de
mostrar el resultado en pantalla. As el navegador que incluye un intrprete de Javascript, se
encargar automticamente de ejecutar el cdigo cuando cargue la pgina y reflejar el efecto de la
ejecucin sobre la pgina que tiene que mostrar.
En la unidad anterior vimos las diferentes formas de embeber el cdigo Javascript en la pgina
HTML.
DEPURACIN DE JAVASCRIPT.
El problema que tenemos al programar en javascript es la depuracin del cdigo, ya que si no
tenemos algn tipo de herramienta es bastante complicada. Si utilizamos Firefox para nuestras
pruebas, podemos utilizar Firebug, que es una extensin de Firefox muy til para desarrolladores
del web, que permite examinar minuciosamente cada uno de los elementos de la pgina, en busca de
errores del cdigo o fallos de presentacin. Por medio de Firebug podemos controlar cualquier cosa
que ocurre dentro de Firefox cuando carga cualquier pgina web. Permite examinar todos los
elementos HTML, y adems los estilos CSS y los cdigos de scripting en Javascript que est
ejecutando la pgina.
Antes que nada habra que comentar lo que son las extensiones de Firefox. Son una especie de
plugins o aadidos que se pueden instalar de manera adicional en Firefox, para proveer al
navegador de nuevas funcionalidades.
Firebug es una de esas extensiones imprescindibles para desarrolladores, que nos puede ahorrar
mucho tiempo, puesto que ayuda a buscar errores o entender posibles comportamientos anmalos o
no esperados de la pgina que estamos desarrollando. Con Firebug podemos examinar cada parte de
la pgina, saber de qu elementos depende dentro de la jerarqua de etiquetas HTML y todos los
estilos CSS que se aplican. Adems de permitir alterar en lnea cualquier etiqueta o
declaracin de estilos, para ver el resultado sin tener que editar el cdigo y recargar el
documento. Adems, nos da informaciones completas de los script Javascript y los errores que se
puedan producir en la ejecucin del cdigo.
Como cualquier extensin de Firefox, es gratuita y libre de uso, con lo que cualquiera se puede
aprovechar de esta importante ventaja para desarrollar webs libres de errores.
Entre las caractersticas de la extensin destacamos:
Se puede abrir Firebug en una nueva ventana o bien en la parte de debajo de la ventana del
navegador. Una vez instalada la extensin, en el men de herramientas tenemos las
opciones de Firebug, para ponerlo en funcionamiento y definir donde queremos que
aparezca la consola.
Se puede inspeccionar cualquier etiqueta HTML y editarla desde el propio Firebug, para ver
los resultados en la pgina al instante.
Lo mismo con los estilos CSS, podemos ver qu estilos afectan a cada rea o elemento de la
pgina y editarlos en el instante por medio de la consola Firebug, viendo los resultados en la
propia pgina.
Tiene herramientas para ver cmo se maquetan los elementos de la pgina con las
propiedades CSS, para ver donde se sita cada elemento y por qu, los mrgenes, padding,

etc.
Otra cosa interesante que ofrece es una visualizacin del tiempo que ocupa al navegador
descargar o poner en marcha cada uno de los elementos que componen la pgina, lo que nos
puede dar una idea de qu consumos de tiempo tiene cada parte, como imgenes, banners,
scripts externos, etc. Muy til si tu pgina se retrasa en cargar y no sabes exactamente por
qu.
Permite debug del cdigo Javascript. Adems, cuando algo no funciona bien, Firebug lo
resalta para que lo veas fcilmente y te da informaciones sobre lo que puede estar
ocurriendo.
Permite explorar la jerarqua Javascript de componentes del navegador (DOM).
Para instalar firebug, vamos a Herramientas>Complementos, y tecleamos firebug, hacemos clic en
Intro, nos aparece el complemento, hacemos clic en instalar y procedemos a instalarlo. Una vez
instalado nos aparecer un insecto en la barra de herramientas a la izquierda, y haciendo clic en el
mismo podemos hacer que se active/desactive el depurador. Podemos utilizar la tecla F12 para
activar/desactivar FireBug.
Cuando est activado firebug, la pantalla de Firefox se divide en dos, en la parte superior podemos ver
el aspecto de la pgina, mientras que en la parte inferior podemos ver el cdigo de la misma. Tenemos
varias pestaas en la parte inferior que nos permiten ver el HTML, el CSS, el DOM, etc. La pestaa
consola nos permite visualizar los errores de javascript. En ocasiones los errores estn en la lnea
superior no en la que nos seala la consola.
El comando console.log (), nos permite visualizar mensajes en la consola para obtener una especie de
traza de por donde va nuestro cdigo, por ejemplo console.log ("Pasando", var1), nos imprimir en la
consola el texto Pasando seguido del valor de la variable var1, lo que nos permite realizar un seguimiento
dentro de un bucle. Para limpiar la consola tenemos console.clear();

Actividad 1: Vamos a crear un fichero HTML vaco, y aadiremos el siguiente cdigo

Javascript en el cuerpo de la pgina (entre las etiquetas <body> y </body>)
<script type="text/javascript">
document.bgColor="red";
alert ('Cambiamos el color de la p\xE1gina');
</script>
Guarda el fichero con el nombre actividad1.html, abrela con tu navegador y comprueba el
resultado. Introduce alguna lnea que contenga un error, y empleando firebug obtn la lnea donde
se encuentra el error.
Google Chrome tambin cuenta con una consola de javascript, que nos permite tambin depurar
los errores de cdigo, para activarla vamos a Herramientas>Consola de Javascript, se nos
presenta la pantalla dividida en dos partes como ocurre con Firebug, en la parte inferior hay una
serie de pestaas; la pestaa Elements nos permite ver el cdigo de la pgina, mientras que la
pestaa Console nos permite utilizar la consola de la misma forma que hemos visto con FireBug.
Podemos usar la tecla F12 para activar/desactivar la consola de javascript.
Por ltimo Internet Explorer tambin cuenta con una consola de javascript, para activarla,
hacemos clic en Herramientas>Herramientas de desarrollo. Tambin podemos pulsar la tecla
F12, para activar/desactivar la consola de javascript.

Podemos observar que en la primera actividad hemos utilizado una cadena de escape para mostrar
correctamente los caracteres tildados. Para evitar este problema debemos emplear la cadena \xdd,
donde dd corresponde al carcter especial especificado por dos dgitos hexadecimales segn el
estndar Unicode. Existen diferentes secuencias de escape que son tiles a la hora de introducir no
solo caracteres tildados, sino tambin saltos de lnea (\n), tabuladores (\t), etc.

2.1 LA SINTAXIS DE JAVASCRIPT.

Una de las primera dificultades que encuentran los programadores novatos en Javascript es que este
lenguaje distingue entre maysculas y minsculas, a diferencia de HTML, que no realiza ninguna
diferencia entre ellas.
Esta regla cobra importancia cuando utilizamos variables, objetos, funciones o cualquier otro
smbolo del lenguaje.Por ejemplo no es lo mismo utilizar la funcin alert() que Alert(), ya que
Alert() no existe a menos que la defina el programador.
Javascript permite insertar comentarios dentro del cdigo, las lneas de comentario son ignoradas
por el navegador, su funcin principal es la de facilitar la lectura del cdigo al programador.
Existen dos formas de insertar comentarios. Una de ellas es a travs de la doble barra (//), con la
cual comentamos una sola lnea de cdigo. La otra forma que podemos utilizar para comentar un
cdigo es a travs de los signos /* al inicio del comentario y los signos */ al final del mismo. De
este modo podemos comentar varias lneas de cdigo. En el cdigo siguiente vemos un ejemplo de
las dos formas que existen para insertar comentarios:
<script type="text/javascript">
// Este modo permite comentar una sola lnea
/* Este modo permite realizar
comentarios
de varias lineas */
</script>
Javascript ignora los espacios, las tabulaciones y los saltos de lnea presentes entre los smbolos del
cdigo.
En el momento en que los programas empiezan a ser complejos, podemos apreciar la utilidad de
emplear las tabulaciones y los saltos de lnea convenientemente para mejorar la presentacin y la
legibilidad del cdigo. A continuacin podemos observar la diferencia entre un cdigo bien
estructurado que facilita la lectura y un cdigo que no est bien estructurado.
Versin 1:
<script type="text/javascript">var i,j=0;
for (i=0;i<5;i++){alert"Variable i:" +i);
for (j=0;j<5;j++){if (i % 2==0) {
document.write
(i+"-"+j+"<br>");}}}</script>

Versin 2:
<script type="text/javascript">
var i,j=0;
for (i=0;i<5;i++) {
alert("Variable :" +i);
for (j=0;j<5;j++){
if (i % 2==0) {
document.write (i+"-"+j+"<br>");
}
}
}
</script>
Podemos ver que la segunda versin es mucho ms fcil de comprender.
Normalmente se suele insertar un signo de punto y coma (;) al final de cada instruccin de
Javascript, al igual que se hace en lenguajes de programacin como C o Java. Este signo tiene la
utilidad de separar y diferenciar cada instruccin.
Por ejemplo, las siguientes instrucciones podran escribirse de este modo:
pi_egipcio = 3.16
pi_griego = 3.14
Sin embargo, si queremos definir los dos valores en una misma lnea, es necesario utilizar al menos
el primer punto y coma:
pi_egipcio = 3.16; pi_griego = 3.14;
Es aconsejable utilizar siempre el punto y coma, para marcar el final de una instruccin.
Javascript contiene una serie de palabra reservadas que no podemos utilizar para definir nombres
de variables, funciones o etiquetas. Segn la versin 5.1 de ECMAScript, las palabras reservadas
son las siguientes:

break

delete

if

this

while

case

do

in

throw

with

catch

else

instanceof

try

continue

finally

new

typeof

debugger

for

return

var

default

function

switch

void

Adems de las anteriores palabras reservadas del lenguaje, el estndar ECMAScript contempla el
uso de otras palabras reservadas en futuras versiones, como por ejemplo class,const,enum y
export. Aunque los interpretes actuales de Javascript permiten el uso de estas futuras palabras
clave, podemos revisar la versin del estndar e indagar cuales son en el momento actual, con el fin
de evitar su uso en la realizacin de programas.

En la pgina web http://www.ecmascript.org podemos consultar las palabras reservadas para las
futuras versiones del estndar. Otras webs de interes relacionadas con el lenguaje son:
http://www.w3schools.com y http://www.desarrolloweb.com entre otras.

2.2 TIPOS DE DATOS.

En todo programa informtico manipulamos constantemente diferentes tipos de valores como por
ejemplo nmeros o textos. Los tipos de datos especifican qu tipo de valor se guardar en una
determinada variable. Este concepto es importante a la hora de determinar cmo podemos combinar
ciertas variables o si es posible hacerlo.
Los tres tipos de datos primitivos de Javascript son : nmeros,cadenas de texto y valores
booleanos. Adems de estos tres tipos de datos, existe el tipo de datos compuesto llamado objeto.
Este representa una coleccin de valores primitivos o de valores compuestos por otros objetos.
En Javascript a diferencia de la mayora de lenguajes de programacin, existe solo un tipo de datos
numrico. Todos los nmeros que utilicemos, ya sean valores enteros o valores de punto flotante,
se representarn a travs del formato de punto flotante de 64 bits. Este formato se llama double en
los lenguajes Java o C++.
Adems de los valores enteros en base 10, en Javascript es posible utilizar valores hexadecimales,
es decir en base 16. Para ello, es necesario iniciar el valor con 0x seguido por una secuencia de
dgitos dcimales. Por ejemplo var hexad=0xe3;
El tipo de datos que utiliza Javascript para representar cadenas de texto, es llamado string. Con este
tipo de datos es posible representar una secuencia de letras, dgitos, signos de puntuacin o
cualquier otro carcter Unicode. Las cadenas de caracteres la debemos definir entre comillas dobles
o comillas simples (" o ').
Dado que las comillas dobles o simples las utilizamos para delimitar las cadenas de texto, es posible
que surja la duda de qu hacer para representar estos signos. Para ello, necesitamos utilizar
secuencias de escape haciendo uso de la barra invertida (\). La combinacin de esta barra con otros
caracteres permite que el navegador pueda representar un carcter, que sin la ayuda de la barra
invertida no podra representarse. En la tabla siguiente podemos ver las principales combinaciones
de secuencias de escape.
Secuencia de escape

Resultado

\\

Bara Invertida

\'

Comilla Simple

\"

Comilla Doble

\n

Salto de lnea

\t

Tabulacin Horizontal

\v

Tabulacin vrtical

\f

Salto de pgina

\r

Retorno de carro

\b

Retroceso

El tipo de datos booleano, tambin conocido como valores lgico, es el tipo de datos ms simple
debido a que admite solo dos valores:true o false (verdadero o falso). Debemos definir estos
valores sin ningn tipo de comillas. Este tipo de datos es bastante til a la hora de evaluar
expresiones lgicas o verificar condiciones particulares en nuestros programas.
Actividad 2.
Crea un fichero HTML que permita mostrar el siguiente texto en una ventana emergente, a travs de
la funcin alert(). Ten en cuenta que debes usar secuencias de escape para poder representar las
comillas simples y el salto de lnea.
I'm=I am
I don't=I do not

2.3 VARIABLES.
Las variables se pueden definir como zonas de la memoria de un ordenador que se identifican
con un nombre y en las cuales se almacenan ciertos datos. Las variables nos permiten manipular
y guardar datos que, en algunos casos, no sabremos su valor a priori. El desarrollo de un script
conlleva generalmente dos aspectos relacionados con las variables:

Declaracin de variables.
Inicializacin de variables.

El primer paso para utilizar una variable es definirla. En Javascript las variables se definen a travs
de la palabra clave var seguida por el nombre que queramos darle a la variable, tal y como se
muestra en el siguiente ejemplo:
var mi_variable_1;
var mi_variable_2;
Es posible declarar ms de una variable en una sola lnea de cdigo a travs de la separacin por
comas: var mi_variable_1,mi_variable_2;
En los ejemplos anteriores hemos declarado las variables, pero no les hemos asignado ningn valor.
El contenido de las variables estar indefinido (undefined) hasta que una parte del cdigo
almacene un valor en ellas.
Podemos realizar la asignacin de un valor a una variable de tres formas:

Asignacin directa de un valor concreto.

Asignacin indirecta a travs de un clculo en el que se implican a otras
variables o constantes.
Asignacin a travs de la solicitud del valor al usuario del programa.

A continuacin, podemos ver los ejemplos respectivos de cada caso:

var mi_variable_1=30;
var mi_variable_2=mi_variable_1 + 10;

var mi_variable_3=prompt("Introduce un valor: ");

En todas ellas debemos utilizar el operador de asignacin (el signo igual =). Si en algn fragmento
del cdigo intentamos utilizar una variable que no haya sido inicializada, Javascript generar un
error.
Podemos inicializar una variable sin utilizar la palabra clave var. De este modo Javascript declara
implcitamente dicha variable, pero tenemos que tener en cuenta que esta variable ser una variable
global. Esto quiere decir que su valor tendr un mbito global, incluso dentro de funciones locales.
Siempre que sea posible hay que intentar utilizar el menor nmero de variables globales.
Una vez declarada e inicializada una variable, podemos utilizarla en otras instrucciones del
programa.
Actividad 3.
Crea un fichero HTML llamado actividad3.html y copia el siguiente cdigo Javascript dentro del
cuerpo de la pgina:
<script type="text/javascript">
var primer_saludo="hola";
var segundo_saludo=primer_saludo;
primer_saludo="hello";
alert(segundo_saludo);
</script>

2.4 OPERADORES.
Hasta el momento hemos utilizado ejemplos con sentencias bastantes sencillas pero, a partir de
ahora, podremos construir diferentes expresiones en las que tendremos una coleccin de smbolos,
palabras o nmeros con los que podremos realizar clculos ms complejos. Es posible construir este
tipo de expresiones gracias al uso de los operadores de Javascript. Javascript utiliza cinco tipo de
operadores:

Operadores aritmticos
Operadores lgicos
Operadores de asignacin
Operadores de comparacin
Operadores condicionales.

Los elementos utilizados en una expresin y unidos a travs de un operador se definen como
operandos.
Los operadores aritmticos permiten realizar clculos elementales entre variables numricas. En la
tabla siguiente podemos ver las cuatro operaciones aritmticas
elementales:suma,resta,multiplicacin y divisin, adems de otros tres operadores menos
comunes:mdulo,incremento y decremento.

Operador

Nombre

Descripcin

Suma

Efecta la suma entre los operandos

Resta

Efecta la resta entre los operandos

Multiplicacin

Divisin

Efecta la divisin entre los operandos

Mdulo

Extrae el resto de la divisin entre los operandos

++

Incremento

Permite incrementar un valor

--

Decremento

Permite decrementar un valor.

Efecta la multiplicacn entre los operandos.

El operador mdulo divide un nmero entre otro y lo que devuelve es el resto de dicha divisin. Por
ejemplo, si quisiramos comprobar que el ao 2012 es un ao bisiesto (teniendo en cuenta algunas
excepciones, los aos bisiestos son divisibles por 4) debemos realizar la operacin siguiente:
var anyo=2012;
var bisiesto=2012 % 4;
Si la variable bisiesto almacena el valor 0, podemos afirmar que 2012 es un ao bisiesto.
Los operadores incremento y decremento permiten realizar una de las operaciones ms comunes en
los lenguajes de programacin, es decir, incrementar o decrementar un valor en una unidad. Es
posible utilizar estos operadores antes o despus de la variable, aunque su efecto es diferente en
ambos casos. Por ejemplo, el siguiente cdigo almacena el valor 2 en ambas variables
variable_1=1;
variable_2=++variable_1;
Mientras que en este otro ejemplo la primera variable contendr el valor 2 y la segunda 1:
variable_1=1;
variable_2=variable1++;
Los operadores lgicos tienen la utilidad de combinar o manipular diferentes expresiones lgicas
con el fin de evaluar si el resultado de esta combinacin es verdadero o falso. Generalmente, se
utiliza este tipo de operadores en el caso en que debamos tomar decisiones dentro de un programa.
Podemos ver los tres operadores lgicos que existen en la tabla siguiente:
Operador

Nombre

Descripcin

&&

And

||

Or

Ejecuta la operacin booleana OR sobre los valores. Devuelve true solo si

al menos uno de los valores es true. Devuelve false en caso contrario.

Not

Invierte el valor booleano de su operando

Ejecuta la operacin booleana And sobre los valores. Devuelve true solo
si todos los valores son true. Devuelve false en caso contrario.

Adems del operador de asignacin igual (=), Javascript cuenta con otros operadores de asignacin
que tienen una caracterstica en comn con los operadores aritmticos de incremento y decremento.

Esta caracterstica es la de ahorrarnos tiempo y disminuir la cantidad de cdigo escrito en los

programas. Gracias al uso de estos operadores, podemos obtener mtodos abreviados que permiten
evitar el tener que escribir dos veces la variable que se encuentra a la izquierda del operador. La
Tabla siguiente muestra todos los operadores de asignacin.

Operador

Nombre

+=

Suma y asigna

Ejecuta una suma y asigna el valor al operando de la izquierda

-=

Resta y asigna

Ejecuta una resta y asigna el valor al operando de la izquierda

*=

Descripcin

Multiplica y asigna Ejecuta una multiplicacin y asigna el valor al operando de la

izquierda,

/=

Divide y asigna

Ejecuta una divisin y asigna el valor al operando de la izquierda

%=

Mdulo y asigna

Ejecuta el mdulo y asigna el valor al operando de la izquierda

Por ejemplo, podramos usar el operador de restar y asignar de este modo:

var deudas=1500;
deudas -=300;
// esto es lo mismo que escribir deudas=deudas-300
Los operadores de comparacin, como indica su nombre nos permiten comparar todo tipo de
variables con el fin de verificar sus valores. El resultado de dicha comparacin nos devolver un
valor booleano y determina el orden relativo de dos valores. La comparacin ejecutada por estos
operadores se puede realizar slo sobre nmeros y cadenas. Si utilizamos otro tipo de datos, estos
se convertirn automticamente para intentar que la comparacin se pueda llevar a cabo.
Operador

Nombre

Descripcin

<

Menor que

Verifica si el operando a la izquierda del operador es menor

que el operando de la derecha. Devuelve true en ese caso o
false en caso contrario.

<=

Menor o igual que

Verifica si el operando a la izquierda del operador es menor o

igual que el operando de la derecha. Devuelve true en ese
caso o false en caso contrario.

==

Igual

Verifica si los dos operandos son iguales. Devuelve true en

ese caso o false en caso contrario.

>

Mayor que

Verifica si el operando a la izquierda del operador es mayor

que el operando de la derecha. Devuelve true en ese caso o
false en caso contrario

>=

Mayor o igual que

Verifica si el operando a la izquierda del operador es mayor o

igual que el operando de la derecha. Devuelve true en ese
caso o false en caso contrario

!=

Diferente

Verifica si los dos operandos son diferentes. Devuelve true en

ese caso o false en caso contrario

Estrictamente igual

Verifica si el operando a la izquierda del operador es igual y

del mismo tipo que el operando de la derecha. Devuelve true
en ese caso o false en caso contrario

===

!==

Estrictamente
diferente

Verifica si el operando a la izquierda del operador es diferente

y/o de tipo diferente que el operando de la derecha. Devuelve
true en ese caso o false en caso contrario.

Existe otro tipo de operador un poco ms complejo, pero bastante til a la hora de tomar decisiones
en los programas de Javascript. Se trata del operador condicional. Con este operador podemos
indicarle al navegador que ejecute una accin en concreto despus de evaluar una expresin. El
operador condicional consta de tres partes:la primera es la expresin a evaluar, la segunda es la
accin a realizar si la expresin es verdadera, y la tercera parte es la accin a realizar si la expresin
es falsa.

Operador
?:

Nombre
Condicional

Descripcin
Si la expresin antes del operador es verdadera, se utiliza el primer
valor a la derecha. En caso contrario se utiliza el segundo valor a la
derecha.

Actividad 4. Por ejemplo, si queremos avisar al usuario que no se puede efectuar una divisin por
ceso, es posible hacerlo mediante un operador condicional:
<script type="text/javascript">
var dividendo=prompt ("Introduce el dividendo: ");
var divisor=prompt("Introduce el divisor: ");
var resultado;
divisor != 0 ? resultado=dividendo/divisor :
alert ("No es posible la divisin por cero");
alert ("El resultado es: " + resultado);
</script>

2.5 SENTENCIAS CONDICIONALES.

Los ejemplos que hemos utilizado hasta el momento han sido ejemplo lneales en los que las
sentencias las ejecutbamos unas detrs de otras, desde la primera hasta la ltima. Podemos
controlar la toma de decisiones y el posterior resultado por parte del navegador atravs del uso de
sentencias condicionales. Dichas sentencias permiten evaluar condiciones y ejecutar ciertas
instrucciones si la condicin es verdadera y ejecutar otras instrucciones diferentes si la condicin es
falsa.
Existen tres tipos de sentencias condicionales:la sentencia if, la sentencia switch y las sentencias en
bucle while y for. La sentencia if indica al navegador si debe ejecutar una parte de cdigo en base
al valor lgico de una expresin condicional.
La sentencia switch compara el valor de una variable con una serie de valores conocidos. Si uno de
los valores conocidos coincide con el valor de la variable, se ejecuta el cdigo asociado a dicho
valor. Las sentencias en bucle permiten al navegador ejecutar un fragmento de cdigo de forma
repetida mientras la condicin sea verdadera.
La sentencia if es una sentencia fundamental a la hora de realizar controles en la ejecucin de los
programas. De este modo, el navegador tomar una decisin y ejecutar ciertas instrucciones de
forma condicional. Su sintaxis es la siguiente:

if (expresin) {
instrucciones
}
La expresin puede ser una comparacin o una expresin lgica que devuelve los valores true o
false. Las instrucciones son el cdigo que ejecutaremos si la expresin devuelve el valor true.
Javascript ignora las instrucciones en el caso de que la expresin devuelve valor false.
El uso de las llaves {} no es obligatorio en el caso de que ejecutemos una sola instruccin, en caso
contrario, s que es obligatorio su uso.
La segunda forma de utilizar la sentencia if es agregando la palabra clave else. De este modo
podemos ejecutar instrucciones en el caso en que la expresin devuelva el valor false. As es como
definimos una sentencia if-else:
if (expresin) {
instrucciones_si_true
} else {
instrucciones_si_false
}
La tercera forma de utilizar la sentencia if es mediante la sentencia if-else-if. De este modo, le
pedimos al navegador que evale una expresin, y si sta devuelve el valor false, el navegador
evaluar una nueva expresin. Si ninguna de las dos o ms expresiones utilizadas devuelve el valor
true, es posible utilizar un ltimo else, donde es posible escribir el cdigo que se ejecutar en este
caso. La estructura de la sentencia if-else-if es la siguiente:
if (expresin_1) {
instrucciones_1
} else if (expresin_2) {
instrucciones_2
} else {
instrucciones_else
}
En el caso de que debamos utilizar demasiadas sentencias del tipo else-if, es preferible utilizar la
sentencia switch, ya que facilita la lectura y el mantenimiento del cdigo.
Una vez que conozcamos y dominemos el uso de las sentencia if, ser posible escribir cdigo con
tomas de decisiones ms complejas a travs de if anidados.
Los if anidados nos permitirn solucionar problemas que se nos presentan con frecuencia, como por
ejemplo la toma de decisiones basadas en decisiones precedentes.
En algunos casos es necesario comparar el valor de una variable con algunos valores conocidos,
para estas situaciones Javascript proporciona la sentencia switch. En este sentencia se tiene una
expresin a evaluar y una serie de posibles valores de dicha expresin, llamados casos, en los que
se encuentran las instrucciones a ejecutar cuando coincidan el valor de la expresin y el valor de
cada caso. La sintaxis de esta sentencia es la siguiente:

switch (expresin) {
case valor1:
instrucciones_valor1;
break;
case valor2:
instrucciones_valor2;
break;
case valor3:
instrucciones_valor3;
break;
default:
instrucciones_default;
}
Cada caso termina con la palabra clave break. La utilidad de esta palabra clave es la de detener la
ejecucin del switch en el momento en que uno de los casos resulte verdadero. De este modo no
perdemos tiempo en evaluar los dems casos.
Las instrucciones que se encuentren dentro de la sentencia opcional default, se ejecutarn solo
cuando ninguno de los valores de cada caso coincida con el valor de la expresin.
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");
}
El bucle while consta de tres partes fundamentales:la palabra clave while, la expresin condicional
y las instrucciones que se ejecutan en el caso de que la expresin condicional sea verdadera.

Este bucle es el ms utilizado cuando no disponemos de informacin que nos indique el nmero de
veces que debemos repetir la iteracin del bucle. El navegador ejecutar una o ms instrucciones
continuamente hasta que la condicin deje de ser verdadera. Su sintaxis es la siguiente:
while (expresin) {
instrucciones
}
Una variacin del bucle while es del denominado do-while, su estructura es la siguiente:
do {
instrucciones
} while (expresin)
De este modo nos asegura que la ejecucin del bucle se lleve a cabo al menos una vez y solo al
final, se evala si se debe seguir ejecutando o no.
El bucle for permite que un navegador ejecute las instrucciones que se encuentren dentro del mismo
bucle hasta que la expresin condicional devuelva el valor false. Este tipo de bucles consta de cinco
partes:la palabra clave for, el valor inicial de la variable de control, la condicin basada en dicha
variable, el incremento o decremento de la variable y el cuerpo del bucle. Su sintaxis general es la
siguiente:
for (Valor_inicial;expresion_condicional;incremento_o_decremento_de_la_variable) {
cuerpo_del_bucle
}
Vamos un ejemplo que muestra en pantalla un valor que se incrementa en cada una de las diez
iteraciones del bucle:
for (i=0;i<10;i++) {
document.write ("El valor de la variable de control es : " + i + " <br>")
}
Actividad 5:
Crea el fichero actividad5.html que nos muestre la tabla del 5.
Actividad 6:
Crea el fichero actividad6.html vaco y aade el siguiente cdigo en Javascript en el cuerpo de la
pgina (entre las etiquetas <body> y </body>):
<script type="text/javascript">
var maxvalue=Number.MAX_VALUE;
var minvalue=Number.MIN_VALUE;
alert ("Max Value: " + maxvalue);
alert ("Min Value: " +minvalue);
alert ("Valor especial: " + maxvalue*2);
</script>

De este modo podremos comprobar el nmero ms grande representable en Javascript, el nmero

ms pequeo y el valor especial que representa el infinito.
Actividad 7:
Inserta el siguiente script en el fichero HTML actividad7.html y comprueba su funcionamiento.
Posteriormente cambia la lnea countdown-- por countdown++ y explica por que el navegador no
deja de solicitarnos valores.
<script type="text/javascript">
var countdown=prompt ("Introduce un numero para iniciar la cuenta atrs: ");
while (countdown > 0) {
alert (countdown+ "...");
countdown--;
}
</script>
Actividad 8:
Realiza el mismo ejercicio anterior, pero sustituyendo el bucle while por un bucle for:

TEST DE CONOCIMIENTOS.
1. Qu navegador web actual incorpora un intrprete para cdigo Javascript?.

Firefox.
Safari
Chrome
Todos los anteriores

2. El lenguaje Javascript distingue entre maysculas y minsculas?

Solamente en el cdigo que se encuentre dentro de las etiquetas <body> y

</body>.
Solamente en el nombre de las variables
Distingue en todo el cdigo Javascript
Solamente en el uso de las palabras clave

3. Para terminar una instruccin en Javascript se utiliza:

Un punto y coma.
La palabra clave end.
La etiqueta </script>.
Un punto y coma o un salto de lnea.

4. Cal de los siguientes comentarios es correcto en Javascript?

/ Comentario
*/ Comentario */
//Comentario
<!--Comentario-->

5. Cul es el nmero ms grande representable por Javascript?

No existe un lmite
9.99x10 elevado a 308
1.7976931348623157x10 elevado a 308
Ninguno de los anteriores

6. En la expresin a + b, qu parte de la expresin son las letras a y b ?

Operadores
Operandos

Sumas
Incrementos

7. Cal es el resultado de la expresin 10 < 100 ? 'Verdadero' : 'Falso' ?

True
10 < 100
Falso
Verdadero

8. Para qu sirve la palabra else en una sentencia if-else?

Para anidar una sentencia if

Para definir una nueva expresin condicional.
Para ejecutar instrucciones en el caso en que la expresin condicional sea falsa.
Para ejecutar instrucciones en el caso en que la expresin condicional sea
verdadera

9. Qu sentencia condicional permite ejecutar instrucciones independientemente de si una

condicin sea verdadera o falsa?
If
do-while
while
for