Manual de JavaScript

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 1 de 125

 Manual de JavaScript

Introduccin: Manual de JavaScript

Manual de Javascript desde cero. Adntrate en el lenguaje de programacin ms popular de la web y conoce
todas las caractersticas de la programacin del lado del cliente.

Javascript es el lenguaje de programacin usado para las pginas web, compatible con todos los navegadores
y que forma un estndar de desarrollo que ahora tambin se extiende a dispositivos o programas de
propsito general multiplataforma.

Este manual de Javascript est dividido en dos grandes partes. En la primera parte veremos las
caractersticas fundamentales del lenguaje, como su sintaxis, variables, estructuras de control, funciones,
arrays, etc. Toda la informacin que encontrars en la primera parte te sirve para programar Javascript a
nivel general, sea donde sea el entorno de ejecucin de tus programas.

En la segunda parte, que tambin encontrars en esta misma pgina, ahondaremos en el uso de Javascript en
el mbito del navegador, es decir, aprenderemos a manejar los recursos que nos ofrece el navegador para
hacer pginas interactivas, capaces de interactuar con el usuario de manera avanzada.

Encuentras este manual online en:

http://desarrolloweb.com/manuales/manual-javascript.html

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 2 de 125

 Manual de JavaScript

Autores del manual

Las siguientes personas han participado como autores escribiendo artculos de este manual.

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formacin online

EscuelaIT. Comenz en el mundo del desarrollo web en el ao 1997,
transformando su hobby en su trabajo.

Manu Gutierrez

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 3 de 125

 Manual de JavaScript

Introducciones a Javascript

Artculos que nos servirn para introducirnos en este lenguaje, aprendiendo los conceptos ms bsicos de
Javascript y la programacin del lado del cliente.

Introduccin a Javascript
Veamos qu es JavaScript y las posibilidades que nos ofrece utilizar este lenguaje a la hora de
desarrollar pginas web. Conocemos algo de su historia.

Con este artculo comenzamos el Manual de Javascript, en el que esperamos ofrecer un punto de partida
para las personas que quieren introducirse en el mundo de la programacin web del lado del cliente.

El curso de Javascript que hemos preparado en DesarrolloWeb.com est dividido en dos partes
fundamentales. En este primer manual pretendemos explicar el lenguaje Javascript de manera general,
ofreciendo informacin sobre cmo incluir scripts y lidiar con los elementos ms bsicos de cualquier
lenguaje de programacin, como son las variables, operadores, estructuras de control, funciones, etc. La
segunda parte del manual la dedicaremos a explorar temas ms especficos sobre cmo Javascript nos puede
ayudar a aplicar dinamismo a una pgina web, a travs del control dinmico de elementos de la pgina y la
interaccin con el usuario.

Nota: Por tanto, en este primer manual encontraris que se ofrece mucha ms informacin terica
tpica sobre lenguajes de programacin. Ser esencial para saber cmo dar los primeros pasos en la
programacin, pero quizs resulte un poco ms aburrida que la segunda parte, donde aprenderemos a
alterar dinmicamente la pgina web, responder a acciones del usuario, etc.

Nosotros hemos querido explicar las cosas con detenimiento, para que aprender Javascript con este
manual est al alcance de personas incluso sin conocimientos de programacin. No obstante, en
DesarrolloWeb.com existen diversos manuales ms bsicos todava para aprender a programar, como
puede ser el curso de programacin en vdeo, o ms especficos para la web con el manual de Pginas
dinmicas o la introduccin a la programacin.

Sin embargo, quizs personas ms experimentadas puedan preferir pasar directamente a la segunda parte
de este manual, donde explicaremos cosas ms prcticas y volver sobre artculos puntuales de este
manual para utilizarlos como referencia a medida que vayan necesitando conocer la sintaxis de
determinadas estructuras de control, operadores del lenguaje, construccin de funciones, etc.

En este artculo pretendemos explicar qu es Javascript y para qu sirve este lenguaje, al menos en lneas
generales. A lo largo de ste y los prximos artculos explicaremos los conceptos necesarios para que las
personas tengan una idea ms o menos clara sobre Javascript, las posibilidades de del lenguaje o usos ms
comunes y los modos de trabajo que podemos emplear para desarrollar nuestros propios scripts.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 4 de 125

 Manual de JavaScript

Nota: Otro recurso que queremos recomendar para aprender Javascript, especialmente indicado para las
personas con menos experiencia, es el Videotutorial de Javascript. Por supuesto, tampoco nos queremos
olvidar de los Talleres de Javascript, as como otros manuales ms especficos que encontrars en la
seccin Javascript a fondo.

Qu es Javascript

Javascript es un lenguaje de programacin utilizado para crear pequeos programitas encargados de realizar
acciones dentro del mbito de una pgina web. Con Javascript podemos crear efectos especiales en las
pginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las
instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor
recurso, y tal vez el nico, con que cuenta este lenguaje es el propio navegador.

Javascript es el siguiente paso, despus del HTML, que puede dar un programador de la web que decida
mejorar sus pginas y la potencia de sus proyectos. Es un lenguaje de programacin bastante sencillo y
pensado para hacer las cosas con rapidez, a veces con ligereza. Incluso las personas que no tengan una
experiencia previa en la programacin podrn aprender este lenguaje con facilidad y utilizarlo en toda su
potencia con slo un poco de prctica.

Entre las acciones tpicas que se pueden realizar en Javascript tenemos dos vertientes. Por un lado los
efectos especiales sobre pginas web, para crear contenidos dinmicos y elementos de la pgina que tengan
movimiento, cambien de color o cualquier otro dinamismo. Por el otro, javascript nos permite ejecutar
instrucciones como respuesta a las acciones del usuario, con lo que podemos crear pginas interactivas con
programas como calculadoras, agendas, o tablas de clculo.

Javascript es un lenguaje con muchas posibilidades, permite la programacin de pequeos scripts, pero
tambin de programas ms grandes, orientados a objetos, con funciones, estructuras de datos complejas,
etc. Toda esta potencia de Javascript se pone a disposicin del programador, que se convierte en el
verdadero dueo y controlador de cada cosa que ocurre en la pgina.

En este manual vamos a tratar de acercarnos a este lenguaje en profundidad y conocer todos sus secretos y
mtodos de trabajo. Al final del manual seremos capaces de controlar el flujo en nuestros programas
Javascript y saber cmo colocar scripts para resolver distintas necesidades que podamos tener. Todo lo que
veremos a continuacin nos servir de base para adentrarnos ms adelante en el desarrollo de pginas
enriquecidas del lado del cliente.

Algo de la historia de Javascript

En Internet se han creado multitud de servicios para realizar muchos tipos de comunicaciones, como
correo, charlas, bsquedas de informacin, etc. Pero ninguno de estos servicios se ha desarrollado tanto
como el Web. Si estamos leyendo estas lneas no vamos a necesitar ninguna explicacin de lo que es el web,
pero si podemos hablar un poco sobre cmo se ha ido desarrollando con el paso de los aos.

El Web es un sistema Hipertexto, una cantidad de dimensiones gigantes de textos interrelacionados por
medio de enlaces. Cada una de las unidades bsicas donde podemos encontrar informacin son las pginas
web. En un principio, para disear este sistema de pginas con enlaces se pens en un lenguaje que

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 5 de 125

 Manual de JavaScript

permitiese presentar cada una de estas informaciones junto con unos pequeos estilos, este lenguaje fue el
HTML.

Conforme fue creciendo el Web y sus distintos usos se fueron complicando las pginas y las acciones que se
queran realizar a travs de ellas. Al poco tiempo qued patente que HTML no era suficiente para realizar
todas las acciones que se pueden llegar a necesitar en una pgina web. En otras palabras, HTML se haba
quedado corto ya que slo sirve para presentar el texto en un pgina, definir su estilo y poco ms.

Al complicarse los sitios web, una de las primeras necesidades fue que las pginas respondiesen a algunas
acciones del usuario, para desarrollar pequeas funcionalidades ms all de los propios enlaces. El primer
ayudante para cubrir las necesidades que estaban surgiendo fue Java, que es un lenguaje de propsito
general, pero que haba creado una manera de incrustar programas en pginas web. A travs de la tecnologa
de los Applets, se poda crear pequeos programas que se ejecutaban en el navegador dentro de las propias
pginas web, pero que tenan posibilidades similares a los programas de propsito general. La programacin
de Applets fue un gran avance y Netscape, por aquel entonces el navegador ms popular, haba roto la
primera barrera del HTML al hacer posible la programacin dentro de las pginas web. No cabe duda que la
aparicin de los Applets supuso un gran avance en la historia del web, pero no ha sido una tecnologa
definitiva y muchas otras han seguido implementando el camino que comenz con ellos.

Llega Javascript

Netscape, despus de hacer sus navegadores compatibles con los applets, comenz a desarrollar un lenguaje
de programacin al que llam LiveScript que permitiese crear pequeos programas en las pginas y que
fuese mucho ms sencillo de utilizar que Java. De modo que el primer Javascript se llamo LiveScript, pero
no dur mucho ese nombre, pues antes de lanzar la primera versin del producto se forj una alianza con
Sun Microsystems, creador de Java, para desarrollar en conjunto ese nuevo lenguaje.

La alianza hizo que Javascript se diseara como un hermano pequeo de Java, solamente til dentro de las
pginas web y mucho ms fcil de utilizar, de modo que cualquier persona, sin conocimientos de
programacin pudiese adentrase en el lenguaje y utilizarlo a sus anchas. Adems, para programar Javascript
no es necesario un kit de desarrollo, ni compilar los scripts, ni realizarlos en ficheros externos al cdigo
HTML, como ocurra con los applets.

Netscape 2.0 fue el primer navegador que entenda Javascript y su estela fue seguida por otros clientes web
como Internet Explorer a partir de la versin 3.0. Sin embargo, la compaa Microsoft nombr a este
lenguaje como JScript y tena ligeras diferencias con respecto a Javascript, algunas de las cuales perduran
hasta el da de hoy.

Diferencias entre distintos navegadores

Como hemos dicho el Javascript de Netscape y el de Microsoft Internet Explorer tena ligeras diferencias,
pero es que tambin el propio lenguaje fue evolucionando a medida que los navegadores presentaban sus
distintas versiones y a medida que las pginas web se hacan ms dinmicas y ms exigentes las necesidades
de funcionalidades.

Las diferencias de funcionamiento de Javascript han marcado las historia del lenguaje y el modo en el que
los desarrolladores se relacionan con l, debido a que estaban obligados a crear cdigo que funcionase
correctamente en diferentes plataformas y diferentes versiones de las mismas. A da de hoy, siguen habiendo

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 6 de 125

 Manual de JavaScript

muchas diferencias y para solucionarlo han surgido muchos productos como los Frameworks Javascript,
que ayudan a realizar funcionalidades avanzadas de DHTML sin tener que preocuparse en hacer versiones
distintas de los scripts, para cada uno de los navegadores posibles del mercado.

A continuacin seguiremos aprendiendo curiosidades del lenguaje y aclararemos que Java y Javascript son
dos cosas distintas, en el artculo sobre las diferencias de Java y Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 16/07/2001
Disponible online en http://desarrolloweb.com/articulos/introduccion-javascript.html

Diferencias entre Java y Javascript

Java y Javascript son dos productos distintos. Ponemos de manifiesto la diferencia entre estos dos
lenguajes con un nombre similar.

Estamos contando diversos asuntos interesantes y curiosidades que sirven de introduccin para el Manual
de Javascript y queremos tratar una de las ms tpicas asociaciones que se se hacen al oir hablar de
Javascript. Nos referimos a relacionarlo con otro lenguaje de programacin, llamado Java, que no tiene
mucho que ver. Realmente Javascript se llam as porque Netscape, que estaba aliado a los creadores de
Java en la poca, quiso aprovechar el conocimiento y la percepcin que las personas tenan del popular
lenguaje. Con todo, se cre un producto que tena ciertas similitudes, como la sintaxis del lenguaje o el
nombre. Se hizo entender que era un hermano pequeo y orientado especficamente para hacer cosas en las
pginas web, pero tambin se hizo caer a muchas personas en el error de pensar que son lo mismo.

Queremos que quede claro que Javascript no tiene nada que ver con Java, salvo en sus orgenes, como
se ha podido leer hace unas lneas. Actualmente son productos totalmente distintos y no guardan entre si
ms relacin que la sintaxis idntica y poco ms. Algunas diferencias entre estos dos lenguajes son las
siguientes:

Compilador. Para programar en Java necesitamos un Kit de desarrollo y un compilador. Sin

embargo, Javascript no es un lenguaje que necesite que sus programas se compilen, sino que stos
se interpretan por parte del navegador cuando ste lee la pgina.
Orientado a objetos. Java es un lenguaje de programacin orientado a objetos. (Ms tarde veremos
que quiere decir orientado a objetos, para el que no lo sepa todava) Javascript no es orientado a
objetos, esto quiere decir que podremos programar sin necesidad de crear clases, tal como se realiza
en los lenguajes de programacin estructurada como C o Pascal.
Propsito. Java es mucho ms potente que Javascript, esto es debido a que Java es un lenguaje de
propsito general, con el que se pueden hacer aplicaciones de lo ms variado, sin embargo, con
Javascript slo podemos escribir programas para que se ejecuten en pginas web.
Estructuras fuertes. Java es un lenguaje de programacin fuertemente tipado, esto quiere decir que
al declarar una variable tendremos que indicar su tipo y no podr cambiar de un tipo a otro
automticamente. Por su parte Javascript no tiene esta caracterstica, y podemos meter en una
variable la informacin que deseemos, independientemente del tipo de sta. Adems, podremos
cambiar el tipo de informacin de una varible cuando queramos.
Otras caractersticas. Como vemos Java es mucho ms complejo, aunque tambin ms potente,

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 7 de 125

 Manual de JavaScript

robusto y seguro. Tiene ms funcionalidades que Javascript y las diferencias que los separan son lo
suficientemente importantes como para distinguirlos fcilmente.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 16/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Antes de empezar
Mostramos ejemplos de pginas que emplean JavaScript en su desarrollo y comentamos las
aplicaciones necesarias para empezar a programar.

Hay varios puntos que queremos comentar como introduccin en el Manual de Javascript y que podrs
querer conocer antes de comenzar a programar. Primero sera bueno hacernos una idea ms concreta de las
posibles aplicaciones que podra tener el lenguaje y que se pueden encontrar en innumerables sitios web.
Adems tambin queremos comentar las herramientas y conocimientos previos que necesitamos para
ponernos manos a la obra.

Usos de Javascript

Quizs a da de hoy sobra decir para qu sirve Javascript, pero veamos brevemente algunos usos de este
lenguaje que podemos encontrar en el web para hacernos una idea de las posibilidades que tiene.

Sin ir ms lejos, DesarrolloWeb.com utiliza Javascript para el men superior, que muestra diferentes enlaces
dentro de cada opcin principal. Vamos cambiando la pgina cada cierto tiempo, pero en el diseo actual de
este sitio web, elementos como el recuadro de "Login" tambin tienen su dinamismo con Javascript.

Actualmente casi todas las pginas un poco avanzadas utilizan Javascript, pues se ha vuelto una de las
insignias de lo que se denomina la Web 2.0 y la experiencia enriquecida de usuario. Por ejemplo, webs tan
populares como Facebook, Twitter o Youtube usan Javascript a raudales. Para ser ms concretos, cuando
en la red social apretamos un enlace para comentar algo, se muestra en la pgina un pequeo formulario que
aparece como por arte de magia y luego se enva sin salirse de la propia pgina. Tambin cuando votamos
por un vdeo en Youtube o cuando se cuentan los caracteres que llevamos escritos en los mini-post de
Twitter, se utiliza Javascript para realizar pequeas funcionalidades que no es posible realizar con HTML
slo. En realidad se pueden ver ejemplos de Javascript dentro de cualquier pgina un poco compleja.
Algunos que habremos visto en innumerables ocasiones son calendarios dinmicos para seleccionar fechas,
calculadoras o convertidores de divisas, editores de texto enriquecido, navegadores dinmicos, etc.

Es mucho ms habitual encontrar Javascript para realizar efectos simples sobre pginas web, o no tan
simples, como pueden ser navegadores dinmicos, apertura de ventanas secundarias, validacin de
formularios, etc. Nos atrevemos a decir que este lenguaje es realmente til para estos casos, pues estos
tpicos efectos tienen la complejidad justa para ser implementados en cuestin de minutos sin posibilidad de
errores. Sin embargo, aparte de esos unos simples ejemplos, podemos encontrar dentro de Internet muchas
aplicaciones que basan parte de su funcionamiento en Javascript, que hacen que una pgina web se
convierta en un verdadero programa interactivo de gestin de cualquier recurso. Ejemplos claros son las
aplicaciones de ofimatica online, como Google Docs, Office Online o Google Calendar.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 8 de 125

 Manual de JavaScript

Qu necesitas para trabajar con Javascript

Para programar en Javascript necesitamos bsicamente lo mismo que para desarrollar pginas web con
HTML. Un editor de textos y un navegador compatible con Javascript. Cualquier ordenador mnimamente
actual posee de salida todo lo necesario para poder programar en Javascrip. Por ejemplo, un usuario de
Windows dispone dentro de su instalacin tpica de sistema operativo, de un editor de textos, el Bloc de
notas, y de un navegador: Internet Explorer.

Nota: Usuarios que deseen herramientas ms avanzadas pueden encontrar en Internet fcilmente
programas similares en la seccin de programas para desarrolladores.

Permitidme una recomendacin con respecto al editor de textos. Se trata de que, aunque el Bloc de Notas es
suficiente para empezar, tal vez sea muy til contar con otros programas que nos ofrecen mejores
prestaciones a la hora de escribir las lneas de cdigo. Estos editores avanzados tienen algunas ventajas
como que colorean los cdigos de nuestros scripts, nos permiten trabajar con varios documentos
simultneamente, tienen ayudas, etc. Entre otros queremos destacar Komodo Edit, Notepad++ o
UltraEdit.

Conocimientos previos recomendables

Lo cierto es que no hace falta tener mucha base de conocimientos para ponerse a programar en Javascript.
Lo ms seguro es que si lees estas lneas ya sepas todo lo necesario para trabajar, puesto que ya habrs
tenido alguna relacin con el desarrollo de sitios web y habrs detectado que para hacer ciertas cosas te
viene bien conocer un poco de Javascript.

No obstante, sera bueno tener un dominio avanzado de HTML, al menos el suficiente para escribir cdigo
en ese lenguaje sin tener que pensar qu es lo que ests haciendo. Tambin ser til un conocimiento medio
sobre CSS y quizs alguna experiencia previa sobre algn lenguaje de programacin, aunque en este manual
de DesarrolloWeb.com vamos a tratar de explicar Javascript incluso para personas que no hayan
programado nunca.

En el siguiente artculo seguiremos con temas que sirven de introduccin al lenguaje de scripting del lado
del cliente viendo las algunas diferencias de Javascript que existen en las versiones de navegadores que han
ido apareciendo.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 16/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Versiones de navegadores y de Javascript

Presentamos las diferentes versiones de JavaScript, los navegadores que las aceptan y sus
contribuciones con respecto a las predecesoras.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 9 de 125

 Manual de JavaScript

Para continuar con la introduccin al lenguaje que estamos viendo en el Manual de Javascript, tambin
resulta apropiado introducir las distintas versiones de Javascript que existen y que han evolucionado en
conjunto con las versiones de navegadores. El lenguaje ha ido avanzando durante sus aos de vida e
incrementando sus capacidades. En un principio poda realizar muchas cosas en la pgina web, pero tena
pocas instrucciones para crear efectos especiales.

Con el tiempo tambin el HTML ha avanzado y se han creado nuevas caractersticas como las capas, que
permiten tratar y maquetar los documentos de manera distinta. Javascript ha avanzado tambin y para
manejar todas estas nuevas caractersticas se han creado nuevas instrucciones y recursos. Para resumir
vamos a comentar las distintas versiones de Javascript:

Actualizado: En el momento de actualizar este artculo, podemos decir que no tenemos que
preocuparnos mucho de las versiones de Javascript que puedan haber existido. Realmente cualquier
navegador medianamente moderno tendr ahora todas las funcionalidades de Javascript que vayamos a
necesitar y sobre todo, las que podamos utilizar en nuestros primeros pasos con el lenguaje. No obstante
puede venir bien conocer las primeras versiones de Javascript que comentamos en este artculo, a modo
de curiosidad.

Javascript 1: naci con el Netscape 2.0 y soportaba gran cantidad de instrucciones y funciones, casi
todas las que existen ahora ya se introdujeron en el primer estandar.
Javascript 1.1: Es la versin de Javascript que se dise con la llegada de los navegadores 3.0.
Implementaba poco ms que su anterior versin, como por ejemplo el tratamiento de imgenes
dinmicamente y la creacin de arrays.
Javascript 1.2: La versin de los navegadores 4.0. Esta tiene como desventaja que es un poco
distinta en plataformas Microsoft y Netscape, ya que ambos navegadores crecieron de distinto
modo y estaban en plena lucha por el mercado.
Javascript 1.3: Versin que implementan los navegadores 5.0. En esta versin se han limado
algunas diferencias y asperezas entre los dos navegadores.
Javascript 1.5: Versin actual, en el momento de escribir estas lneas, que implementa Netscape 6.
Por su parte, Microsoft tambin ha evolucionado hasta presentar su versin 5.5 de JScript (as
llaman al javascript utilizado por los navegadores de Microsoft).

Es obvio que todava, despus de escribir estas lneas, se presentarn o habrn presentado muchas otras
versiones de Javascript, pues, a medida que se van mejorando los navegadores y van saliendo versiones de
HTML, surgen nuevas necesidades para programacin de elementos dinmicos. No obstante, todo lo que
vamos a aprender en este manual, incluso otros usos mucho ms avanzados, ya est implementado en
cualquier Javascript que existan en la actualidad.

En el siguiente artculo comenzaremos ya a mostrar pequeos cdigos Javascript que servirn para hacer
efectos simples en pginas web.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 16/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 10 de 125

 Manual de JavaScript

Efectos rpidos con Javascript

En este ltimo artculo de introduccin a Javascript veremos algunos ejemplos de cdigos sencillos
de gran utilidad.

Antes de meternos de lleno en materia podemos ver una serie de efectos rpidos que se pueden programar
con Javascript, lo que nos puede hacer una idea ms clara de las capacidades y potencia del lenguaje. A
continuacin veremos varios ejemplos, que hemos destacado para esta introduccin en el Manual de
Javascript, por tener un mnimo de complejidad y aunque sean muy bsicos, nos vendrn bien para tener
una idea ms exacta de lo que es Javascript a la hora de recorrer los siguientes captulos.

Abrir una ventana secundaria

Primero vamos a ver que con una lnea de Javascript podemos hacer cosas bastante atractivas. Por ejemplo
podemos ver cmo abrir una ventana secundaria sin barras de mens que muestre el buscador Google. El
cdigo sera el siguiente.

<script>

window.open("http://www.google.com","","width=550,height=420,menubar=no")

</script>

Podemos ver el ejemplo en marcha aqu.

Un mensaje de bienvenida

Podemos mostrar una caja de texto emergente al terminarse de cargar la portada de nuestro sitio web, que
podra dar la bienvenida a los visitantes.

<script>

window.alert("Bienvenido a mi sitio web. Gracias...")

</script>

Puedes ver el ejemplo en una pgina a parte.

Fecha actual

Veamos ahora un sencillo script para mostrar la fecha de hoy. A veces es muy interesante mostrarla en las
webs para dar un efecto de que la pgina est al "al da", es decir, est actualizada.

<script> document.write(new Date()) </script>

Estas lneas deberan introducirse dentro del cuerpo de la pgina en el lugar donde queramos que aparezca
la fecha de ltima actualizacin. Podemos ver el ejemplo en marcha aqu.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 11 de 125

 Manual de JavaScript

Nota: Un detalle a destacar es que la fecha aparece en un formato un poco raro, indicando tambin la
hora y otros atributos de la misma, pero ya aprenderemos a obtener exactamente lo que deseemos en el
formato correcto.

Botn de volver

Otro ejemplo rpido se puede ver a continuacin. Se trata de un botn para volver hacia atrs, como el que
tenemos en la barra de herramientas del navegador. Ahora veremos una lnea de cdigo que mezcla HTML
y Javascript para crear este botn que muestra la pgina anterior en el historial, si es que la hubiera.

<input type=button value=Atrs onclick="history.go(-1)">

El botn sera parecido al siguiente, un botn normal con el aspecto predeterminado que el navegador y
sistema operativo que usas otorgue a los botones. A continuacin tienes una imagen sobre cmo se vera el
botn en mi sistema.

Como diferencia con los ejemplos anteriores, hay que destacar que en este caso la instruccin Javascript se
encuentra dentro de un atributo de HTML, onclick, que indica que esa instruccin se tiene que ejecutar
como respuesta a la pulsacin del botn.

Se ha podido comprobar la facilidad con la que se pueden realizar algunas acciones interesantes. Como
podris imaginar, existiran muchas otras muestras sencillas de Javascript que nos reservamos para captulos
posteriores.

Si lo deseas, puedes ver cmo hemos desarrollado algunos de estos efectos rpidos Javascript paso por paso
y en vdeo. En el siguiente artculo empezaremos ya a hablar del propio lenguaje de programacin
Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 16/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 12 de 125

 Manual de JavaScript

Primeros pasos con el lenguaje

Javascript

Comenzamos a aprender cosas que tienen que ver directamente con la programacin en el lenguaje
Javascript y la manera con la que se integra ste en una pgina web.

El lenguaje Javascript
Veamos cmo se escribe el cdigo en Javascript y para ello comentaremos las primeras reglas para
insertar scripts en pginas web.

En esta parte del manual sobre Javascript vamos a conocer la manera ms bsica de trabajar con el lenguaje.
En este artculo daremos las primeras informaciones sobre cmo incluir scripts, mezclando el propio cdigo
Javascript con el HTML.

Luego veremos tambin cmo se debe colocar cdigo para que nuestra web sea compatible con todos los
navegadores, incluso aquellos que no soportan Javascript. Muchas ideas del funcionamiento de Javascript ya
se han descrito en captulos anteriores, pero con el objetivo de no dejarnos nada en el tintero vamos a tratar
de acaparar a partir de aqu todos los datos importantes de este lenguaje.

Javascript se escribe en el documento HTML

Lo ms importante y bsico que podemos destacar en este momento es que la programacin de Javascript
se realiza dentro del propio documento HTML. Es decir, el cdigo Javascript, en la mayora de los casos, se
mezcla con el propio cdigo HTML para generar la pgina.

Esto quiere decir que debemos aprender a mezclar los dos lenguajes de programacin y rpidamente
veremos que, para que estos dos lenguajes puedan convivir sin problemas entre ellos, se han de incluir unos
delimitadores que separan las etiquetas HTML de las instrucciones Javascript. Estos delimitadores son las
etiquetas <SCRIPT> y </SCRIPT>. Todo el cdigo Javascript que pongamos en la pgina ha de ser
introducido entre estas dos etiquetas.

La colocacin de los scripts s que importa

En una misma pgina podemos introducir varios scripts, cada uno que podra introducirse dentro de unas
etiquetas <SCRIPT> distintas. La colocacin de estos scripts no es indiferente. En un principio, con lo que
sabemos hasta el momento y los scripts que hemos realizado de prueba, nos da un poco igual donde
colocarlos, pero en determinados casos esta colocacin s que ser muy importante. En cada caso, y llegado
el momento, se informar de ello convenientemente.

Tambin se puede escribir Javascript dentro de determinados atributos de la pgina, como el atributo onclick.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 13 de 125

 Manual de JavaScript

Estos atributos estn relacionados con las acciones del usuario y se llaman manejadores de eventos.

Vamos a ver en el siguiente captulo com ms detenidamente estas dos maneras de escribir scripts, que
tienen como diferencia principal el momento en que se ejecutan las sentencias.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 29/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Maneras de ejecutar scripts Javascript

Existen dos maneras bsicas de ejecutar scripts Javascript en una pgina: al cargar la pgina o
como respuesta a acciones del usuario.

Hasta ahora en el Manual de Javascript ya hemos tenido la ocasin de probar algunos scripts sencillos, no
obstante, todava tenemos que aprender una de las bases para poder trabajar con el lenguaje y es aprender
las dos maneras de ejecutar cdigo Javascript. Existen dos maneras fundamentales de ejecutar scripts
en la pgina. La primera de estas maneras se trata de ejecucin directa de scripts, la segunda es una
ejecucin como respuesta a la accin de un usuario.

Explicaremos ahora cada una de estas formas de ejecucin disponibles, pero para el que lo desee,
recomendamos tambin ver el vdeo sobre Maneras de incluir y ejecutar scripts.

Ejecucin directa

Es el mtodo de ejecutar scripts ms bsico. En este caso se incluyen las instrucciones dentro de la etiqueta
<SCRIPT>, tal como hemos comentado anteriormente. Cuando el navegador lee la pgina y encuentra un
script va interpretando las lneas de cdigo y las va ejecutando una despus de otra. Llamamos a esta manera
ejecucin directa pues cuando se lee la pgina se ejecutan directamente los scripts.

Este mtodo ser el que utilicemos preferentemente en la mayora de los ejemplos de esta parte del Manual
de Javascript. En la segunda parte del Manual de Javascript podremos aprender muchas cosas y entre ellas
veremos con detalle el segundo modo de ejecucin de scripts que vamos a relatar a continuacin.

Respuesta a un evento

Es la otra manera de ejecutar scripts, pero antes de verla debemos hablar sobre los eventos. Los eventos son
acciones que realiza el usuario. Los programas como Javascript estn preparados para atrapar determinadas
acciones realizadas, en este caso sobre la pgina, y realizar acciones como respuesta. De este modo se
pueden realizar programas interactivos, ya que controlamos los movimientos del usuario y respondemos a
ellos. Existen muchos tipos de eventos distintos, por ejemplo la pulsacin de un botn, el movimiento del
ratn o la seleccin de texto de la pgina.

Las acciones que queremos realizar como respuesta a un evento se han de indicar dentro del mismo cdigo
HTML, pero en este caso se indican en atributos HTML que se colocan dentro de la etiqueta que queremos
que responda a las acciones del usuario. En el captulo donde vimos algn ejemplo rpido ya comprobamos

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 14 de 125

 Manual de JavaScript

que si queramos que un botn realizase acciones cuando se pulsase sobre el, debamos indicarlas dentro del
atributo onclick del botn.

Comprobamos pues que se puede introducir cdigo Javascript dentro de determinados atributos de las
etiquetas HTML. Veremos ms adelante este tipo de ejecucin en profundidad y los tipos de eventos que
existen. Pero para llegar a ello aun tenemos que aprender muchas otras cosas de Javascript. En el prximo
artculo mostraremos cmo podemos ocultar el cdigo Javascript para navegadores antiguos.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 29/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Ocultar scripts Javascript en navegadores antiguos

No todos los navegadores son compatibles con Javascript, as que tenemos que aprender cmo
hacer que los scripts no molesten en navegadores que no los entienden.

A lo largo de los anteriores captulos del Manual de Javascript ya hemos visto que el lenguaje se implement
a partir de Netscape 2.0 e Internet Explorer 3.0. Incluso, para los que no lo sepan, est bien decir que hay
navegadores que funcionan en sistemas operativos, donde slo se puede visualizar texto y donde
determinadas tecnologas y aplicaciones no estn disponibles, como el uso de imgenes, fuentes tipogrficas
distintas o el propio Javascript.

As pues, no todos los navegadores que puedan utilizar los usuarios que visiten nuestra pgina comprenden
Javascript. En los casos en los que no se interpretan los scripts, los navegadores asumen que el cdigo de
stos es texto de la propia pgina y como consecuencia, presentan los scripts en el cuerpo del documento,
como si de texto normal se tratara. Para evitar que el texto de los scripts se escriba en la pgina cuando los
navegadores no los entienden se tienen que ocultar los con comentarios HTML (<!-comentario HTML --
>). Adems, en este artculo veremos tambin cmo mostrar un mensaje que se vea slo en los navegadores
que no son compatibles con Javascript.

Actualizado: En el momento actual podemos decir que casi el 100% de los navegadores disponibles
soportan Javascript, o por lo menos reconocen las etiquetas de script, por lo que, aunque est
desactivado, no mostrarn el texto de nuestros programas Javascript. Por ello, actualmente ya no es
fundamental realizar la operacin de ocultar el cdigo de los scripts de la pgina para navegadores
antiguos. No obstante, si queremos hacer una pgina totalmente correcta, convendr aprender cmo se
puede ocultar un script para que en ningn caso se muestre como texto en la pgina.

Ocultar el cdigo Javascript con comentarios HTML

Veamos con un ejemplo de cdigo donde se han utilizado comentarios HTML para ocultar Javascript, o
mejo dicho, el cdigo los scripts Javascript.

<SCRIPT>

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 15 de 125

 Manual de JavaScript

<!--

Cdigo Javascript

//-->

</SCRIPT>

Vemos que el inicio del comentario HTML es idntico a cmo lo conocemos en el HTML, pero el cierre
del comentario presenta una particularidad, que empieza por doble barra inclinada. Esto es debido a que el
final del comentario contiene varios caracteres que Javascript reconoce como operadores y al tratar de
analizarlos lanza un mensaje de error de sintaxis. Para que Javascript no lance un mensaje de error se coloca
antes del comentario HTML esa doble barra, que no es ms que un comentario Javascript, que
conoceremos ms adelante cuando hablemos de sintaxis.

El inicio del comentario HTML no es necesario comentarlo con la doble barra, dado que Javascript
entiende bien que simplemente se pretende ocultar el cdigo. Una aclaracin a este punto: si pusisemos las
dos barras en esta lnea, se veran en navegadores antiguos por estar fuera de los comentarios HTML. Las
etiquetas <SCRIPT> no las entienden los navegadores antiguos, por lo tanto no las interpretan, tal como
hacen con cualquier etiqueta que desconocen.

Mostrar un mensaje para navegadores antiguos con <NOSCRIPT>

Existe la posibilidad de indicar un texto alternativo para los navegadores que no entienden Javascript, para
informarles de que en ese lugar debera ejecutarse un script y que la pgina no est funcionando al 100% de
sus capacidades. Tambin podemos sugerir a los visitantes que actualicen su navegador a una versin
compatible con el lenguaje. Para ello utilizamos la etiqueta <NOSCRIPT> y entre esta etiqueta y su
correspondiente de cierre podemos colocar el texto alternativo al script.

<SCRIPT>

cdigo javascript

</SCRIPT>

<NOSCRIPT>

Este navegador no comprende los scripts que se estn ejecutando, debes actualizar tu versin de navegador a una ms reciente.

<br><br>

<a href=http://netscape.com>Netscape</a>.<br>

<a href=http://microsoft.com>Microsoft</a>.

</NOSCRIPT>

En el siguiente artculo veremos algunos otros detalles sobre colocar scripts Javascript que se han quedado
en el tintero.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 29/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Ms sobre colocar scripts

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 16 de 125

 Manual de JavaScript

ltimas notas sobre cmo colocar scripts. Indicar la versin utilizada y utilizar ficheros externos.

Seguimos ofreciendo captulos del Manual de Javascript, con informacin til para saber cmo utilizar el
lenguaje. As que ahora veremos un par de notas adicionales sobre cmo colocar scripts en pginas web.

En este artculo mostraremos uno de los atributos que se pueden indicar en la etiqueta de SCRIPT, que
indica el lenguaje que vamos a utilizar. Pero sobre todo debemos prestar especial atencin al caso de incluir
archivos externos con Javascript, que sin duda es una manera de trabajar, que utilizaris bastante a menudo.

Indicar el lenguaje que estamos utilizando

La etiqueta <SCRIPT> tiene un atributo que sirve para indicar el lenguaje que estamos utilizando, as como la
versin de este. Por ejemplo, podemos indicar que estamos programando en Javascript 1.2 o Visual Basic
Script, que es otro lenguaje para programar scripts en el navegador cliente que slo es compatible con
Internet Explorer.

El atributo en cuestin es language y lo ms habitual es indicar simplemente el lenguaje con el que se han
programado los scripts. El lenguaje por defecto es Javascript, por lo que si no utilizamos este atributo, el
navegador entender que el lenguaje con el que se est programando es Javascript. Un detalle donde se suele
equivocar la gente sin darse cuenta es que lenguage se escribe con dos -g- y no con -g- y con -j- como en
castellano.

<SCRIPT LANGUAGE=javascript>

Actualizado: Hoy ya ni merece la pena nombrar otros lenguajes de scripting. Javascript es el nico lenguaje
para crear scripts en pginas web aceptado por la industria. Luego, el atributo language es realmente
innecesario. Sin embargo, estamos obligados a definir el atributo "type", que sealamos en el siguiente
punto. A pesar que en HTML 4.01 transicional nos valide correctamente el atributo language, no validar si
estamos haciendo HTML strict, con lo que no recomendamos usar "language" en ningn caso. En los
ejemplos de DesarrolloWeb.com donde se utilizaba language, por favor eliminarlo, pues no validara
correctamente con versiones estndar del lenguaje HTML actual.

Uso del atributo "type":

Cuando colocamos una etiqueta SCRIPT debemos usar el atributo "type" para indicar que tipo de
codificacin de script estamos haciendo y el lenguaje utilizado.

<script type="text/javascript">

El atributo "type" es necesario para que valide correctamente tu documento en las versiones ms actuales
del HTML.

Incluir ficheros externos de Javascript

Otra manera de incluir scripts en pginas web, implementada a partir de Javascript 1.1, es incluir archivos
externos donde se pueden colocar muchas funciones que se utilicen en la pgina. Los ficheros suelen tener

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 17 de 125

 Manual de JavaScript

extensin .js y se incluyen de esta manera.

<SCRIPT type="text/javascript" src="archivo_externo.js">

//estoy incluyendo el fichero "archivo_externo.js"

</SCRIPT>

Dentro de las etiquetas <SCRIPT> se puede escribir cualquier texto y ser ignorado por el navegador, sin
embargo, los navegadores que no entienden el atributo SRC tendrn a este texto por instrucciones, por lo
que es aconsejable poner un comentario Javascript antes de cada lnea con el objetivo de que no respondan
con un error.

El archivo que incluimos (en este caso archivo_externo.js) debe contener tan solo sentencias Javascript. No
debemos incluir cdigo HTML de ningn tipo, ni tan siquiera las etiquetas </SCRIPT> y </SCRIPT>.

Vistos estos otros usos interesantes que existen en Javascript y que debemos conocer para poder aprovechar
las posibilidades de la tecnologa, debemos haber aprendido todo lo esencial para empezar a hacer cosas
ms importantes. As que en el prximo artculo empezaremos a repasar la sintaxis del lenguaje Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 29/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Sintaxis Javascript
Empezamos a contar la sintaxis del lenguaje Javascript, indicando sus principales caractersticas.

Por fin empezamos a ver cdigo fuente de Javascript! Esperamos que se hayan asimilado todas las
informaciones previas del Manual de Javascript, en las que hemos aprendido bsicamente diversos modos
de incluir scripts en pginas web. Hasta ahora todo lo que hemos visto en este manual puede haber parecido
muy terico, pero de aqu en adelante esperamos que os parezca ms ameno por empezar a ver cosas ms
prcticas y relacionadas directamente con la programacin.

El lenguaje Javascript tiene una sintaxis muy parecida a la de Java por estar basado en l. Tambin es
muy parecida a la del lenguaje C, de modo que si el lector conoce alguno de estos dos lenguajes se podr
manejar con facilidad con el cdigo. De todos modos, en los siguientes captulos vamos a describir toda la
sintaxis con detenimiento, por lo que los novatos no tendrn ningn problema con ella.

Comentarios en el cdigo

Un comentario es una parte de cdigo que no es interpretada por el navegador y cuya utilidad radica en
facilitar la lectura al programador. El programador, a medida que desarrolla el script, va dejando frases o
palabras sueltas, llamadas comentarios, que le ayudan a l o a cualquier otro a leer mas fcilmente el script a
la hora de modificarlo o depurarlo.

Ya se vio anteriormente algn comentario Javascript, pero ahora vamos a contarlos de nuevo. Existen dos

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 18 de 125

 Manual de JavaScript

tipos de comentarios en el lenguaje. Uno de ellos, la doble barra, sirve para comentar una lnea de cdigo. El
otro comentario lo podemos utilizar para comentar varias lneas y se indica con los signos / para empezar el
comentario y / para terminarlo. Veamos unos ejemplos.

<SCRIPT>

//Este es un comentario de una lnea

/*Este comentario se puede extender

por varias lneas.

Las que quieras*/

</SCRIPT>

Maysculas y minsculas

En Javascript se han de respetar las maysculas y las minsculas. Si nos equivocamos al utilizarlas el
navegador responder con un mensaje de error, ya sea de sintaxis o de referencia indefinida.

Por poner un ejemplo, no es lo mismo la funcin alert() que la funcin Alert(). La primera muestra un texto
en una caja de dilogo y la segunda (con la primera A mayscula) simplemente no existe, a no ser que la
definamos nosotros. Como se puede comprobar, para que la funcin la reconozca Javascript, se tiene que
escribir toda en minscula. Otro claro ejemplo lo veremos cuando tratemos con variables, puesto que los
nombres que damos a las variables tambin son sensibles a las maysculas y minsculas.

Por regla general, los nombres de las cosas en Javascript se escriben siempre en minsculas, salvo que se
utilice un nombre con ms de una palabra, pues en ese caso se escribirn con maysculas las iniciales de las
palabras siguientes a la primera. Por ejemplo document.bgColor (que es un lugar donde se guarda el color
de fondo de la pgina web), se escribe con la "C" de color en mayscula, por ser la primera letra de la
segunda palabra. Tambin se puede utilizar maysculas en las iniciales de las primeras palabras en algunos
casos, como los nombres de las clases, aunque ya veremos ms adelante cules son estos casos y qu son las
clases.

Separacin de instrucciones

Las distintas instrucciones que contienen nuestros scripts se han de separar convenientemente para que el
navegador no indique los correspondientes errores de sintaxis. Javascript tiene dos maneras de separar
instrucciones. La primera es a travs del carcter punto y coma (;) y la segunda es a travs de un salto de
lnea.

Por esta razn Las sentencias Javascript no necesitan acabar en punto y coma a no ser que coloquemos dos
instrucciones en la misma lnea.

No es una mala idea, de todos modos, acostumbrarse a utilizar el punto y coma despus de cada instruccin
pues otros lenguajes como Java o C obligan a utilizarlas y nos estaremos acostumbrando a realizar una
sintaxis ms parecida a la habitual en entornos de programacin avanzados.

En el prximo artculo comenzaremos a hablaros sobre la creacin de variables en Javascript.

Este artculo es obra de Miguel Angel Alvarez

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 19 de 125

 Manual de JavaScript

Fue publicado por primera vez en 30/07/2001

Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 20 de 125

 Manual de JavaScript

Trabajo con variables y tipos de datos en

Javascript

Una de las cosas ms fundamentales en cualquier lenguaje de programacin son las variables y los tipos de
datos. Veremos qu son y cmo se trabaja con ellos en Javascript.

Variables en Javascript
Vemos en trminos generales qu es una variable, para qu sirve y cmo declarar variables en
Javascript antes de usarlas.

Este es el primero de los artculos que vamos a dedicar a las variables en el Manual de Javascript. Veremos,
si no lo sabemos ya, que las variables son uno de los elementos fundamentales a la hora de realizar los
programas, en Javascript y en la mayora de los lenguajes de programacin existentes.

As pues, en este artculo veremos cul es el concepto de variable y aprenderemos a declararlas en Javascript.

Concepto de variable

Una variable es un espacio en memoria donde se almacena un dato, un espacio donde podemos
guardar cualquier tipo de informacin que necesitemos para realizar las acciones de nuestros programas. Por
ejemplo, si nuestro programa realiza sumas, ser muy normal que guardemos en variables los distintos
sumandos que participan en la operacin y el resultado de la suma. El efecto sera algo parecido a esto.

sumando1 = 23

sumando2 = 33

suma = sumando1 + sumando2

En este ejemplo tenemos tres variables, sumando1, sumando2 y suma, donde guardamos el resultado.
Vemos que su uso para nosotros es como si tuvisemos un apartado donde guardar un dato y que se
pueden acceder a ellos con slo poner su nombre.

Los nombres de las variables han de construirse con caracteres alfanumricos y el carcter subrayado (_).
Aparte de esta, hay una serie de reglas adicionales para construir nombres para variables. La ms importante
es que tienen que comenzar por un carcter alfabtico o el subrayado. No podemos utilizar caracteres raros
como el signo +, un espacio o un $. Nombres admitidos para las variables podran ser:

Edad paisDeNacimiento _nombre

Tambin hay que evitar utilizar nombres reservados como variables, por ejemplo no podremos llamar a
nuestra variable palabras como return o for, que ya veremos que son utilizadas para estructuras del propio

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 21 de 125

 Manual de JavaScript

lenguaje. Veamos ahora algunos nombres de variables que no est permitido utilizar:

12meses tu nombre return pe%pe

Declaracin de variables en Javascript

Declarar variables consiste en definir y de paso informar al sistema de que vas a utilizar una variable. Es una
costumbre habitual en los lenguajes de programacin el definir las variables que se van a usar en los
programas y para ello, se siguen unas reglas estrictas. Pero 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.

Javascript cuenta con la palabra "var" que utilizaremos cuando queramos declarar una o varias variables.
Como es lgico, se utiliza esa palabra para definir la variable antes de utilizarla.

Nota: Aunque Javascript no nos obligue a declarar explcitamente las variables, es aconsejable
declararlas antes de utilizarlas y veremos en adelante que se trata tambin de una buena costumbre.
Adems, en sucesivos artculos veremos que en algunos casos especiales, no producir exactamente los
mismos resultados un script en el que hemos declarado una variable y otro en el que no lo hagamos.

var operando1

var operando2

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

Si lo deseas, puedes ver un ejemplo de pgina que declara variables Javascript.

En el siguiente artculo seguiremos aprendiendo cosas de variables y veremos uno de los conceptos ms
importantes que deberemos aprender sobre ellas, el mbito de las variables.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 30/07/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 22 de 125

 Manual de JavaScript

Ambito de las variables en Javascript

El mbito de las variables en Javascript: qu son las variables locales y globales y cmo se trabaja
con ellas en Javascript.

El mbito de las variables es uno de los conceptos ms importantes que deberemos conocer cuando
trabajamos con variables, no slo en Javascript, sino en la mayora de los lenguajes de programacin.

En el artculo anterior ya comenzamos a explicar qu son las variables y cmo declararlas. En este artculo
del Manual de Javascript pretendemos explicar con detenimiento qu es este mbito de las variables y
ofrecer ejemplos para que se pueda entender bien.

Concepto de mbito de variables

Se le llama mbito de las variables al lugar donde estas estn disponibles. Por lo general, cuando
declaramos una variable hacemos que est disponible en el lugar donde se ha declarado, esto ocurre en
todos los lenguajes de programacin y como Javascript se define dentro de una pgina web, las variables
que declaremos en la pgina estarn accesibles dentro de ella.

En Javascript no podremos acceder a variables que hayan sido definidas en otra pgina. Por tanto, la propia
pgina donde se define es el mbito ms habitual de una variable y le llamaremos a este tipo de variables
globales a la pgina. Veremos tambin se pueden hacer variables con mbitos distintos del global, es decir,
variables que declararemos y tendrn validez en lugares ms acotados.

Variables globales

Como hemos dicho, 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>

Las variables globales son accesibles desde cualquier lugar de la pgina, es decir, desde el script donde se
han declarado y todos los dems scripts de la pgina, incluidos los manejadores de eventos, como el onclick,
que ya vimos que se poda incluir dentro de determinadas etiquetas HTML.

Variables locales

Tambin podremos declarar variables en lugares ms acotados, como por ejemplo 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, es decir, si la habamos declarado en una funcin solo podremos acceder a
ella cuando estemos en esa funcin.

Las variables pueden ser locales a una funcin, pero tambin pueden ser locales a otros mbitos, como por
ejemplo un bucle. En general, son mbitos locales cualquier lugar acotado por llaves.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 23 de 125

 Manual de JavaScript

<SCRIPT>

function miFuncion (){

var variableLocal

</SCRIPT>

En el script anterior hemos declarado una variable dentro de una funcin, por lo que esa variable slo
tendr validez dentro de la funcin. Se pueden ver cmo se utilizan las llaves para acotar el lugar donde est
definida esa funcin o su mbito.

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. En
resumen, la variable que tendr validez en cualquier sitio de la pgina es la global. Menos en el mbito
donde est declarada la variable local, que ser ella quien tenga validez.

<SCRIPT>

var numero = 2

function miFuncion (){

var numero = 19

document.write(numero) //imprime 19

document.write(numero) //imprime 2

</SCRIPT>

Un consejo para los principiantes podra ser no declarar variables con los mismos nombres, para que nunca
haya lugar a confusin sobre qu variable es la que tiene validez en cada momento.

Diferencias entre declarar variables con var, o no declararlas

Como hemos dicho, 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 varible 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.

En el caso de una variable declarada en la pgina web, fuera de una funcin o cualquier otro mbito ms
reducido, nos es indiferente si se declara o no con var, desde un punto de vista funcional. Esto es debido a
que cualquier variable declarada fuera de un mbito es global a toda la pgina. La diferencia se puede
apreciar en una funcin por ejemplo, ya que si utilizamos var la variable ser local a la funcin y si no lo
utilizamos, la variable ser global a la pgina. Esta diferencia es fundamental a la hora de controlar
correctamente el uso de las variables en la pgina, ya que si no lo hacemos en una funcin podramos
sobreescribir el valor de una variable, perdiendo el dato que pudiera contener previamente.

<SCRIPT>

var numero = 2

function miFuncion (){

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 24 de 125

 Manual de JavaScript

numero = 19

document.write(numero) //imprime 19

document.write(numero) //imprime 2

//llamamos a la funcin

miFuncion()

document.write(numero) //imprime 19

</SCRIPT>

En este ejemplo, tenemos una variable global a la pgina llamada numero, que contiene un 2. Tambin
tenemos una funcin que utiliza la variable numero sin haberla declarado con var, por lo que la variable
numero de la funcion ser la misma variable global numero declarada fuera de la funcin. En una situacin
como esta, al ejecutar la funcin se sobreescribir la variable numero y el dato que haba antes de ejecutar la
funcin se perder.

En el prximo artculo continuaremos hablando de variables y mostraremos que en ellas se pueden guardar
distintos tipos de informacin.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 24/08/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Qu podemos guardar en variables

Vemos el concepto de tipos de datos para el lenguaje Javascript y por qu es importante
manejarlos bien.

En el Manual de Javascript ya hemos hablado sobre las variables en varios artculos. Pero todava nos
quedan cosas por ver y en concreto mostraremos en este artculo que en una variable podemos guardar
distintos tipos de datos.

En una variable podemos introducir varios tipos de informacin. Por ejemplo podramos introducir simple
texto, nmeros enteros o reales, etc. A estas distintas clases de informacin se les conoce como tipos de
datos. Cada uno tiene caractersticas y usos distintos.

Veamos cules son los tipos de datos ms habituales de Javascript.

Nmeros

Para empezar 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 (").

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 25 de 125

 Manual de JavaScript

Boleanos

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

Por ltimo sera relevante sealar aqu que nuestras variables pueden contener cosas ms complicadas,
como podra ser un objeto, una funcin, o vaco (null) pero ya lo veremos ms adelante.

En realidad nuestras variables no estn forzadas a guardar un tipo de datos en concreto y por lo tanto no
especificamos ningn tipo de datos para una variable cuando la estamos declarando. Podemos introducir
cualquier informacin en una variable de cualquier tipo, incluso podemos ir cambiando el contenido de una
variable de un tipo a otro sin ningn problema. Vamos a ver esto con un ejemplo.

var nombre_ciudad = "Valencia"

var revisado = true

nombre_ciudad = 32

revisado = "no"

Esta ligereza a la hora de asignar tipos a las variables puede ser una ventaja en un principio, sobretodo para
personas inexpertas, pero a la larga puede ser fuente de errores ya que dependiendo del tipo que son las
variables se comportarn de un modo u otro y si no controlamos con exactitud el tipo de las variables
podemos encontrarnos sumando un texto a un nmero. Javascript operar perfectamente, y devolver un
dato, pero en algunos casos puede que no sea lo que estbamos esperando. As pues, aunque tenemos
libertad con los tipos, esta misma libertad nos hace estar ms atentos a posibles desajustes difciles de
detectar a lo largo de los programas. Veamos lo que ocurrira en caso de sumar letras y nmeros.

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.

Veremos algunas cosas ms referentes a los tipos de datos en el prximo artculo.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 24/08/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Tipos de datos en Javascript

Vemos los tres tipos de datos que soporta Javascript: numerico, boleano y texto.

En el artculo anterior del Manual de Javascript ya empezamos a mostrar que en una variable podemos

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 26 de 125

 Manual de JavaScript

almacenar distintos tipos de informacin. No obstante, todava hay algunas cosas que queremos explicar
sobre los distintos tipos de datos disponibles en Javascript.

En nuestros scripts vamos a manejar variables diversas clases de informacin, como textos o nmeros. Cada
una de estas clases de informacin son los tipos de datos. Javascipt distingue entre tres tipos de datos y
todas las informaciones que se puedan guardar en variables van a estar encajadas en uno de estos tipos de
datos. Veamos detenidamente cules son estos tres tipos de datos.

Tipo de datos numrico

En este lenguaje slo existe un tipo de datos numrico, al contrario que ocurre en la mayora de los
lenguajes ms conocidos. Todos los nmeros son por tanto del tipo numrico, independientemente de la
precisin que tengan o si son nmeros reales o enteros. Los nmeros enteros son nmeros que no tienen
coma, como 3 o 339. Los nmeros reales son nmeros fraccionarios, como 2.69 o 0.25, que tambin se
pueden escribir en notacin cientfica, por ejemplo 2.482e12.

Con Javascript tambin podemos escribir nmeros en otras bases, como la hexadecimal. Las bases son
sistemas de numeracin que utilizan ms o menos dgitos para escribir los nmeros. Existen tres bases con
las que podemos trabajar

Base 10, es el sistema que utilizamos habitualmente, el sistema decimal. Cualquier nmero, por
defecto, se entiende que est escrito en base 10.
Base 8, tambin llamado sistema octal, que utiliza dgitos del 0 al 7. Para escribir un nmero en octal
basta con escribir ese nmero precedido de un 0, por ejemplo 045.
Base 16 o sistema hexadecimal, es el sistema de numeracin que utiliza 16 dgitos, los comprendidos
entre el 0 y el 9 y las letras de la A a la F, para los dgitos que faltan. Para escribir un nmero en
hexadecimal debemos escribirlo precedido de un cero y una equis, por ejemplo 0x3EF.

Tipo boleano

El tipo bolean, boolean en ingls, sirve para guardar un si o un no o dicho de otro modo, un verdadero o un
falso. Se utiliza para realizar operaciones lgicas, generalmente para realizar acciones si el contenido de una
variable es verdadero o falso.

Si una variable es verdadero entonces ----- Ejecuto unas instrucciones Si no ----- Ejecuto otras Los dos
valores que pueden tener las variables boleanas son true o false.

miBoleana = true

<br>

miBoleana = false

Tipo de datos cadena de caracteres

El ltimo tipo de datos es el que sirve para guardar un texto. Javascript slo tiene un tipo de datos para
guardar texto y en el se pueden introducir cualquier nmero de caracteres. Un texto puede estar compuesto
de nmeros, letras y cualquier otro tipo de caracteres y signos. Los textos se escriben entre comillas, dobles
o simples.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 27 de 125

 Manual de JavaScript

miTexto = "Pepe se va a pescar"

miTexto = '23%%$ Letras & *--*'

Todo lo que se coloca entre comillas, como en los ejemplos anteriores es tratado como una cadena de
caracteres independientemente de lo que coloquemos en el interior de las comillas. Por ejemplo, en una
variable de texto podemos guardar nmeros y en ese caso tenemos que tener en cuenta que las variables de
tipo texto y las numricas no son la misma cosa y mientras que las de numricas nos sirven para hacer
clculos matemticos las de texto no.

Caracteres de escape en cadenas de texto

Hay una serie de caracteres especiales que sirven para expresar en una cadena de texto determinados
controles como puede ser un salto de lnea o un tabulador. Estos son los caracteres de escape y se escriben
con una notacin especial que comienza por una contra barra (una barra inclinada al revs de la normal '') y
luego se coloca el cdigo del carcter a mostrar.

Un carcter muy comn es el salto de lnea, que se consigue escribiendo n. Otro carcter muy habitual es
colocar unas comillas, pues si colocamos unas comillas sin su carcter especial nos cerraran las comillas que
colocamos para iniciar la cadena de caracteres. Las comillas las tenemos que introducir entonces con " o '
(comillas dobles o simples). Existen otros caracteres de escape, que veremos en la tabla de abajo ms
resumidos, aunque tambin hay que destacar como carcter habitual el que se utiliza para escribir una
contrabarra, para no confundirla con el inicio de un carcter de escape, que es la doble contrabarra .

Tabla con todos los caracteres de escape

Salto de lnea: \n Comilla simple: \' Comilla doble: \" Tabulador: \t Retorno de carro: \r Avance de pgina:
\f Retroceder espacio: \b Contrabarra: \

Algunos de estos caracteres probablemente no los llegars a utilizar nunca, pues su funcin es un poco rara
y a veces poco clara.

Con esto ya hemos terminado de explicar todo lo que se debe conocer sobre las variables en Javascript y
podemos comenzar con un tema nuevo que ser el de operadores.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 24/08/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 28 de 125

 Manual de JavaScript

Operadores en Javascript

Tratamos en diversos artculos los operadores. Ofreceremos explicaciones de todos los operadores que
podremos encontrarnos en Javascript.

Operadores Javascript
Estudiamos lo que es un operador y para qu sirve. Vemos los operadores de Javascript, en
diversas clasificaciones, aritmticos, asignacin, comparacin, condicionales, a nivel de bit y
preferencia de operadores.

En el presente artculo del Manual de Javascript vamos a comenzar una serie de textos enfocados en
explicar los diferentes operadores disponibles en este lenguaje de programacin.

Al desarrollar programas en cualquier lenguaje se utilizan los operadores, que sirven para hacer los clculos
y operaciones necesarios para llevar a cabo tus objetivos. Hasta el menor de los programas imaginables
necesita de los operadores para realizar cosas, ya que un programa que no realizase operaciones, slo se
limitara a hacer siempre lo mismo.

Es el resultado de las operaciones lo que hace que un programa vare su comportamiento segn los datos
que tenga para trabajar y nos ofrezca resultados que sean relevantes para el usuario que lo utilice. Existen
operaciones ms sencillas o complejas, que se pueden realizar con operandos de distintos tipos, como
nmeros o textos, veremos en este captulo, y los siguientes, de manera detallada todos estos operadores
disponibles en Javascript.

Ejemplos de uso de operadores

Antes de entrar a enumerar los distintos tipos de operadores vamos a ver un par de ejemplos de stos para
que nos ayuden a hacernos una idea ms exacta de lo que son. En el primer ejemplo vamos a realizar una
suma utilizando el operador suma.

3 + 5

Esta es una expresin muy bsica que no tiene mucho sentido ella sola. Hace la suma entre los dos
operandos nmero 3 y 5, pero no sirve de mucho porque no se hace nada con el resultado. Normalmente se
combinan ms de un operador para crear expresiones ms tiles. La expresin siguiente es una combinacin
entre dos operadores, uno realiza una operacin matemtica y el otro sirve para guardar el resultado.

miVariable = 23 * 5

En el ejemplo anterior, el operador * se utiliza para realizar una multiplicacin y el operador = se utiliza para
asignar el resultado en una variable, de modo que guardemos el valor para su posterior uso.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 29 de 125

 Manual de JavaScript

Los operadores se pueden clasificar segn el tipo de acciones que realizan. A continuacin vamos a ver cada
uno de estos grupos de operadores y describiremos la funcin de cada uno.

Operadores aritmticos

Son los utilizados para la realizacin de operaciones matemticas simples como la suma, resta o
multiplicacin. En javascript son los siguientes:

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

Ejemplos

precio = 128 //introduzco un 128 en la variable precio

unidades = 10 //otra asignacin, luego veremos operadores de asignacin

factura = precio * unidades //multiplico precio por unidades, obtengo el valor factura

resto = factura % 3 //obtengo el resto de dividir la variable factura por 3

precio++ //incrementa en una unidad el precio (ahora vale 129)

Operadores de asignacin

Sirven para asignar valores a las variables, ya hemos utilizado en ejemplos anteriores el operador de
asignacin =, pero hay otros operadores de este tipo, que provienen del lenguaje C y que muchos de los
lectores ya conocern.

= Asignacin. Asigna la parte de la derecha del igual a la parte de la izquierda. A al derecha se colocan los
valores finales y a la izquierda generalmente se coloca una variable donde queremos guardar el dato. +=
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

Ejemplos

ahorros = 7000 //asigna un 7000 a la variable ahorros

ahorros += 3500 //incrementa en 3500 la variable ahorros, ahora vale 10500

ahorros /= 2 //divide entre 2 mis ahorros, ahora quedan 5250

En el siguiente artculo seguiremos conociendo otros de los operadores de Javascript: Operadores de

cadenas, operadores lgicos y operadores condicionales.

Operadores de cadenas

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 30 de 125

 Manual de JavaScript

Las cadenas de caracteres, o variables de texto, 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 que veremos ms adelante.

Concatena dos cadenas, pega la segunda cadena a continuacin de la primera.

Ejemplo

cadena1 = "hola"

cadena2 = "mundo"

cadenaConcatenada = cadena1 + cadena2 //cadena concatenada vale "holamundo"

Un detalle importante que se puede ver en este caso es que el operador + sirve para dos usos distintos, si
sus operandos son nmeros los suma, pero si se trata de cadenas las concatena. Esto pasa en general con
todos los operadores que se repiten en el lenguaje, javascript es suficientemente listo para entender que tipo
de operacin realizar mediante una comprobacin de los tipos que estn implicados en lla.

Un caso que resultara confuso es el uso del operador + cuando se realiza la operacin con operadores texto
y numricos entremezclados. En este caso javascript asume que se desea realizar una concatenacin y trata a
los dos operandos como si de cadenas de caracteres se trataran, incluso si la cadena de texto que tenemos
fuese un nmero. Esto lo veremos ms fcilmente con el siguiente ejemplo.

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 hemos podido 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.

Nota: Como se puede haber imaginado, faltan muchas operaciones tpicas a realizar con cadenas, para
las cuales no existen operadores. Es porque esas funcionalidades se obtienen a travs de la clase String
de Javascript, que veremos ms adelante.

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 nuestros scripts. En vez de trabajar con
nmeros, para realizar este tipo de operaciones se utilizan operandos boleanos, que conocimos
anteriormente, que son el verdadero (true) y el falso (false). Los operadores lgicos relacionan los operandos
boleanos para dar como resultado otro operando boleano, tal como podemos ver en el siguiente ejemplo.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 31 de 125

 Manual de JavaScript

Si tengo hambre y tengo comida entonces me pongo a comer

Nuestro programa Javascript utilizara en este ejemplo un operando boleano para tomar una decisin.
Primero mirar si tengo hambre, si es cierto (true) mirar si dispongo de comida. Si son los dos ciertos, se
puede poner a comer. En caso de que no tenga comida o que no tenga hambre no comera, al igual que si
no tengo hambre ni comida. El operando en cuestin es el operando Y, que valdr verdadero (true) en caso
de que los dos operandos valgan verdadero.

Nota: Para no llevarnos a engao, cabe decir que los operadores lgicos pueden utilizarse en
combinacin con tipos de datos distintos de los boleanos, pero en este caso debemos utilizarlos en
expresiones que los conviertan en boleanos. En el siguiente grupo de operadores que vamos a tratar en
este artculo hablaremos sobre los operadores condicionales, que se pueden utilizar junto con los
operadores lgicos para realizar sentencias todo lo complejas que necesitemos. Por ejemplo:

if (x==2 && y!=3){

//la variable x vale 2 y la variable y es distinta de tres

En la expresin condicional anterior estamos evaluando dos comprobaciones que se relacionan con un
operador lgico. Por una parte x==2 devolver un true en caso que la variable x valga 2 y por otra, y!=3
devolver un true cuando la variable y tenga un valor distinto de 3. Ambas comprobaciones devuelven
un boleano cada una, que luego se le aplica el operador lgico && para comprobar si ambas
comprobaciones se cumplieron al mismo tiempo.

Sobra decir que, para ver ejemplos de operadores condicionales, necesitamos aprender estructuras de
control como if, a las que no hemos llegado todava.

! 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.

Ejemplo

miBoleano = true

miBoleano = !miBoleano //miBoleano ahora vale false

tengoHambre = true

tengoComida = true

comoComida = tengoHambre && tengoComida

Operadores condicionales

Sirven para realizar expresiones condicionales todo lo complejas que deseemos. Estas expresiones se
utilizan para tomar decisiones en funcin de la comparacin de varios elementos, por ejemplo si un numero
es mayor que otro o si son iguales.

Nota: Por supuesto, los operadores condicionales sirven tambin para realizar expresiones en las que se
comparan otros tipos de datos. Nada impide comparar dos cadenas, para ver si son iguales o distintas,

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 32 de 125

 Manual de JavaScript

por ejemplo. Incluso podramos comparar boleanos.

Los operadores condicionales se utilizan en las expresiones condicionales para tomas de decisiones. Como
estas expresiones condicionales sern objeto de estudio ms adelante ser mejor describir los operadores
condicionales ms adelante. De todos modos aqu podemos ver la tabla de operadores condicionales.

== Comprueba si dos valores son iguales != Comprueba si dos valores son distintos

Mayor que, devuelve true si el primer operando 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

Veremos ejemplos de operadores condicionales cuando expliquemos estructuras de control, como la

condicional if.

De manera adicional, en este texto veremos un asunto de bastante importancia en la programacin en

general, que es la precedencia de operadores, que debemos tener en cuenta siempre que utilicemos diversos
operadores en una misma expresin, para que se relacionen entre ellos y se resuelvan de la manera habamos
planeado.

Operadores a nivel de bit

Estos son muy poco corrientes y es posible que nunca los llegues a utilizar. Su uso se realiza para efectuar
operaciones con ceros y unos. Todo lo que maneja un ordenador son ceros y unos, aunque nosotros
utilicemos nmeros y letras para nuestras variables en realidad estos valores estn escritos internamente en
forma de ceros y unos. En algunos caso podremos necesitar realizar operaciones tratando las variables
como ceros y unos y para ello utilizaremos estos operandos. En este manual se nos queda un poco grande
realizar una discusin sobre este tipo de operadores, pero aqu podris ver estos operadores por si algn da
os hacen falta.

& Y de bits ^ Xor de bits | O de bits << >> >>> >>>= >>= <<= Varias clases de cambios

Precedencia de los operadores

La evaluacin de una sentencia de las que hemos visto en los ejemplos anteriores es bastante sencilla y fcil
de interpretar, pero cuando en una sentencia entran en juego multitud de operadores distintos puede haber
una confusin a la hora de interpretarla y dilucidar qu operadores son los que se ejecutan antes que otros.
Para marcar unas pautas en la evaluacin de las sentencias y que estas se ejecuten siempre igual y con
sentido comn existe la precedencia de operadores, que no es ms que el orden por el que se irn
ejecutando las operaciones que ellos representan. En un principio todos los operadores se evalan de
izquierda a derecha, pero existen unas normas adicionales, por las que determinados operadores se evalan
antes que otros. Muchas de estas reglas de precedencia estn sacadas de las matemticas y son comunes a
otros lenguajes, las podemos ver a continuacin.

() [] . Parntesis, corchetes y el operador punto que sirve para los objetos ! - ++ -- negacin, negativo e

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 33 de 125

 Manual de JavaScript

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 boleanos = += -= *= /= %= <<= >>= >>>= &= ^= !=
Asignacin

En los siguientes ejemplos podemos ver cmo las expresiones podran llegar a ser confusas, pero con la
tabla de precedencia de operadores podremos entender sin errores cul es el orden por el que se ejecutan.

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

Lo que nos da como resultado el valor siguiente.

39

De todos modos, es importante darse cuenta que el uso de los parntesis puede ahorrarnos muchos
quebraderos de cabeza y sobretodo la necesidad de sabernos de memoria la tabla de precedencia de los
operadores. Cuando veamos poco claro el orden con el que se ejecutarn las sentencias podemos utilizarlos
y as forzar que se evale antes el trozo de expresin que se encuentra dentro de los parntesis.

Para acabar con el tema de operadores nos queda por ver un ltimo operador un tanto especial, llamado
typeof.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 20/09/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 34 de 125

 Manual de JavaScript

Operadores Javascript II
Estudiamos los operadores de cadenas, lgicos y condicionales.

Este es el segundo artculo sobre los operadores que publicamos en el Manual de Javascript, pues son
suficientes como para verlos por partes. En la anterior entrega ofrecimos una breve descripcin del
concepto de operador y vimos los operadores aritmticos y de asignacin.

En el presente texto veremos un listado y descripcin de tres tipos adicionales: operadores de cadenas,
operadores lgicos y operadores condicionales.

Operadores de cadenas

Las cadenas de caracteres, o variables de texto, 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 que veremos ms adelante.

Concatena dos cadenas, pega la segunda cadena a continuacin de la primera.

Ejemplo

cadena1 = "hola"

cadena2 = "mundo"

cadenaConcatenada = cadena1 + cadena2 //cadena concatenada vale "holamundo"

Un detalle importante que se puede ver en este caso es que el operador + sirve para dos usos distintos, si
sus operandos son nmeros los suma, pero si se trata de cadenas las concatena. Esto pasa en general con
todos los operadores que se repiten en el lenguaje, javascript es suficientemente listo para entender que tipo
de operacin realizar mediante una comprobacin de los tipos que estn implicados en lla.

Un caso que resultara confuso es el uso del operador + cuando se realiza la operacin con operadores texto
y numricos entremezclados. En este caso javascript asume que se desea realizar una concatenacin y trata a
los dos operandos como si de cadenas de caracteres se trataran, incluso si la cadena de texto que tenemos
fuese un nmero. Esto lo veremos ms fcilmente con el siguiente ejemplo.

miNumero = 23

miCadena1 = "pepe"

miCadena2 = "456"

resultado1 = miNumero + miCadena1 //resultado1 vale "23pepe"

resultado2 = miNumero + miCadena2 //resultado2 vale "23456"

miCadena2 += miNumero //miCadena2 ahora vale "45623"

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 35 de 125

 Manual de JavaScript

Como hemos podido 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.

Nota: Como se puede haber imaginado, faltan muchas operaciones tpicas a realizar con cadenas, para
las cuales no existen operadores. Es porque esas funcionalidades se obtienen a travs de la clase String
de Javascript, que veremos ms adelante.

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 nuestros scripts. En vez de trabajar con
nmeros, para realizar este tipo de operaciones se utilizan operandos boleanos, que conocimos
anteriormente, que son el verdadero (true) y el falso (false). Los operadores lgicos relacionan los operandos
boleanos para dar como resultado otro operando boleano, tal como podemos ver en el siguiente ejemplo.

Si tengo hambre y tengo comida entonces me pongo a comer

Nuestro programa Javascript utilizara en este ejemplo un operando boleano para tomar una decisin.
Primero mirar si tengo hambre, si es cierto (true) mirar si dispongo de comida. Si son los dos ciertos, se
puede poner a comer. En caso de que no tenga comida o que no tenga hambre no comera, al igual que si
no tengo hambre ni comida. El operando en cuestin es el operando Y, que valdr verdadero (true) en caso
de que los dos operandos valgan verdadero.

Nota: Para no llevarnos a engao, cabe decir que los operadores lgicos pueden utilizarse en
combinacin con tipos de datos distintos de los boleanos, pero en este caso debemos utilizarlos en
expresiones que los conviertan en boleanos. En el siguiente grupo de operadores que vamos a tratar en
este artculo hablaremos sobre los operadores condicionales, que se pueden utilizar junto con los
operadores lgicos para realizar sentencias todo lo complejas que necesitemos. Por ejemplo:

if (x==2 && y!=3){

//la variable x vale 2 y la variable y es distinta de tres

En la expresin condicional anterior estamos evaluando dos comprobaciones que se relacionan con un
operador lgico. Por una parte x==2 devolver un true en caso que la variable x valga 2 y por otra, y!=3
devolver un true cuando la variable y tenga un valor distinto de 3. Ambas comprobaciones devuelven
un boleano cada una, que luego se le aplica el operador lgico && para comprobar si ambas
comprobaciones se cumplieron al mismo tiempo.

Sobra decir que, para ver ejemplos de operadores condicionales, necesitamos aprender estructuras de
control como if, a las que no hemos llegado todava.

! 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.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 36 de 125

 Manual de JavaScript

Ejemplo

miBoleano = true

miBoleano = !miBoleano //miBoleano ahora vale false

tengoHambre = true

tengoComida = true

comoComida = tengoHambre && tengoComida

Operadores condicionales

Sirven para realizar expresiones condicionales todo lo complejas que deseemos. Estas expresiones se
utilizan para tomar decisiones en funcin de la comparacin de varios elementos, por ejemplo si un numero
es mayor que otro o si son iguales.

Nota: Por supuesto, los operadores condicionales sirven tambin para realizar expresiones en las que se
comparan otros tipos de datos. Nada impide comparar dos cadenas, para ver si son iguales o distintas,
por ejemplo. Incluso podramos comparar boleanos.

Los operadores condicionales se utilizan en las expresiones condicionales para tomas de decisiones. Como
estas expresiones condicionales sern objeto de estudio ms adelante ser mejor describir los operadores
condicionales ms adelante. De todos modos aqu podemos ver la tabla de operadores condicionales.

== Comprueba si dos valores son iguales != Comprueba si dos valores son distintos

Mayor que, devuelve true si el primer operando 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

Veremos ejemplos de operadores condicionales cuando expliquemos estructuras de control, como la

condicional if.

En el siguiente artculo finalizaremos el tema de operadores, explicando los operadores a nivel de bit y la
precedencia de operadores.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 20/09/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 37 de 125

 Manual de JavaScript

Operadores Javascript III

Vemos el ltimo tipo de operador, a nivel de bit, y la precedencia de operadores (que operadores se
ejecutan antes o despus).

Continuamos con el tema de operadores, que ya habamos iniciado en captulos anteriores de este manual
de Javascript. En estos momentos ya hemos visto casi todos los tipos de operadores y slo nos queda
conocer un grupo que realmente no se utiliza casi nunca, que son los operadores de nivel de bit.

De manera adicional, en este texto veremos un asunto de bastante importancia en la programacin en

general, que es la precedencia de operadores, que debemos tener en cuenta siempre que utilicemos diversos
operadores en una misma expresin, para que se relacionen entre ellos y se resuelvan de la manera habamos
planeado.

Operadores a nivel de bit

Estos son muy poco corrientes y es posible que nunca los llegues a utilizar. Su uso se realiza para efectuar
operaciones con ceros y unos. Todo lo que maneja un ordenador son ceros y unos, aunque nosotros
utilicemos nmeros y letras para nuestras variables en realidad estos valores estn escritos internamente en
forma de ceros y unos. En algunos caso podremos necesitar realizar operaciones tratando las variables
como ceros y unos y para ello utilizaremos estos operandos. En este manual se nos queda un poco grande
realizar una discusin sobre este tipo de operadores, pero aqu podris ver estos operadores por si algn da
os hacen falta.

& Y de bits ^ Xor de bits | O de bits << >> >>> >>>= >>= <<= Varias clases de cambios

Precedencia de los operadores

La evaluacin de una sentencia de las que hemos visto en los ejemplos anteriores es bastante sencilla y fcil
de interpretar, pero cuando en una sentencia entran en juego multitud de operadores distintos puede haber
una confusin a la hora de interpretarla y dilucidar qu operadores son los que se ejecutan antes que otros.
Para marcar unas pautas en la evaluacin de las sentencias y que estas se ejecuten siempre igual y con
sentido comn existe la precedencia de operadores, que no es ms que el orden por el que se irn
ejecutando las operaciones que ellos representan. En un principio todos los operadores se evalan de
izquierda a derecha, pero existen unas normas adicionales, por las que determinados operadores se evalan
antes que otros. Muchas de estas reglas de precedencia estn sacadas de las matemticas y son comunes a
otros lenguajes, las podemos ver a continuacin.

() [] . Parntesis, corchetes y el operador punto que 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 boleanos = += -= *= /= %= <<= >>= >>>= &= ^= !=
Asignacin

En los siguientes ejemplos podemos ver cmo las expresiones podran llegar a ser confusas, pero con la
tabla de precedencia de operadores podremos entender sin errores cul es el orden por el que se ejecutan.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 38 de 125

 Manual de JavaScript

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

Lo que nos da como resultado el valor siguiente.

39

De todos modos, es importante darse cuenta que el uso de los parntesis puede ahorrarnos muchos
quebraderos de cabeza y sobretodo la necesidad de sabernos de memoria la tabla de precedencia de los
operadores. Cuando veamos poco claro el orden con el que se ejecutarn las sentencias podemos utilizarlos
y as forzar que se evale antes el trozo de expresin que se encuentra dentro de los parntesis.

Para acabar con el tema de operadores nos queda por ver un ltimo operador un tanto especial, llamado
typeof.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 20/09/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Control de tipos
Es importante que conozcamos el tipo de las variables para trabajar sin errores. Vemos cmo
obtenerlo con Javascript.

El listado de operadores que venimos ofreciendo para el Manual de Javascript se completa con el operador
typeof, que veremos a continuacin.

Hemos podido comprobar que, para determinados operadores, es importante el tipo de datos que estn

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 39 de 125

 Manual de JavaScript

manejando, puesto que si los datos son de un tipo se realizarn operaciones distintas que si son de otro.

Por ejemplo, cuando utilizbamos el operador +, si se trataba de nmeros los sumaba, pero si se trataba de
cadenas de caracteres las concatenaba. Vemos pues que el tipo de los datos que estamos utilizando s que
importa y que tendremos que estar pendientes este detalle si queremos que nuestras operaciones se realicen
tal como esperbamos.

Para comprobar el tipo de un dato se puede utilizar otro operador que est disponible a partir de javascript
1.1, el operador typeof, que devuelve una cadena de texto que describe el tipo del operador que estamos
comprobando.

Nota: a lo largo de nuestra experiencia con Javascript veremos que muchas veces es ms til cambiar el
tipo de dato de una variable antes de hacer una comprobacin con tipeof para ver si la podemos utilizar
como operando. Existen diversas funciones para intentar cambiar el tipo de una variable, como
parseInt(), que veremos ms adelante en la Segunda Parte del Manual de Javascript.

var boleano = true

var numerico = 22

var numerico_flotante = 13.56

var texto = "mi texto"

var fecha = new Date()

document.write("<br>El tipo de boleano es: " + typeof boleano)

document.write("<br>El tipo de numerico es: " + typeof numerico)

document.write("<br>El tipo de numerico_flotante es: " + typeof numerico_flotante)

document.write("<br>El tipo de texto es: " + typeof texto)

document.write("<br>El tipo de fecha es: " + typeof fecha)

Si ejecutamos este script obtendremos que en la pgina se escribir el siguiente texto:

El tipo de boleano es: boolean El tipo de numerico es: number El tipo de numerico_flotante es: number El
tipo de texto es: string El tipo de fecha es: object

En este ejemplo podemos ver que ser imprimen en la pgina los distintos tipos de las variables. Estos
pueden ser los siguientes:

boolean, para los datos boleanos. (True o false)

number, para los numricos.
string, para las cadenas de caracteres.
object, para los objetos.

Queremos destacar tan slo dos detalles ms:

1. Los nmeros, ya tengan o no parte decimal, son siempre del tipo de datos numrico.
2. Una de las variables es un poco ms compleja, es la variable fecha que es un objeto de la clase
Date(), que se utiliza para el manejo de fechas en los scripts. La veremos ms adelante, as como los
objetos.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 40 de 125

 Manual de JavaScript

Con esto ya hemos terminado de ver la lista de operadores que podemos utilizar en Javascript y en el
prximo artculo pasaremos a conocer las estructuras de control.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 03/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 41 de 125

 Manual de JavaScript

Estructuras de control en Javascript

Las estructuras de control nos permitirn controlar el flujo de nuestros programas. Por supuesto, tambin
forman parte de los asuntos ms bsicos de Javascript y de cualquier lenguaje de programacin, por lo que
las veremos con detenimiento.

Estructuras de control en Javascript

Introduccin a las estructuras de control. Enumeramos las que tenemos disponibles en Javascript.

Los scripts vistos hasta ahora en el Manual de Javascript han sido tremendamente sencillos y lineales: se
iban ejecutando las sentencias simples una detrs de la otra desde el principio hasta el fin. Sin embargo, esto
no tiene porque ser siempre as y de hecho, en la mayora de los casos las cosas son bastante ms complejas.

Si tenemos alguna experiencia en la programacin sabremos que en los programas generalmente se

necesitar hacer cosas distintas dependiendo del estado de nuestras variables o realizar un mismo proceso
muchas veces sin escribir las mismas lneas de cdigo una y otra vez. Para realizar cosas ms complejas en
nuestros scripts se utilizan las estructuras de control. Con ellas podemos realizar tomas de decisiones y
bucles. En los siguientes captulos vamos a conocer las distintas estructuras de control que existen en
Javascript.

Toma de decisiones

Nos sirven para realizar unas acciones u otras en funcin del estado de las variables. Es decir, tomar
decisiones para ejecutar unas instrucciones u otras dependiendo de lo que est ocurriendo en ese instante en
nuestros programas.

Por ejemplo, dependiendo si el usuario que entra en nuestra pgina es mayor de edad o no lo es, podemos
permitirle o no ver los contenidos de nuestra pgina.

Si edad es mayor que 18 entonces Te dejo ver el contenido para adultos Si no Te mando fuera de la pgina

En Javascript podemos tomar decisiones utilizando dos enunciados distintos.

IF
SWITCH

Bucles

Los bucles se utilizan para realizar ciertas acciones repetidamente. Son muy utilizados a todos los niveles en
la programacin. Con un bucle podemos por ejemplo imprimir en una pgina los nmeros del 1 al 100 sin
necesidad de escribir cien veces el la instruccin imprimir.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 42 de 125

 Manual de JavaScript

Desde el 1 hasta el 100 Imprimir el nmero actual

En javascript existen varios tipos de bucles, cada uno est indicado para un tipo de iteracin distinto y son
los siguientes:

FOR
WHILE
DO WHILE

Como hemos sealado ya, las estructuras de control son muy importantes en Javascript y en cualquier
lenguaje de programacin. Es por ello que en los siguientes captulos veremos cada una de estas estructuras
detenidamente, describiendo su uso y ofreciendo algunos ejemplos. Comenzaremos con la estructura de
control if.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 03/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Estructura IF en Javascript
Vemos cmo trabajar con la estrutura de control IF en Javascript.

En el Manual de Javascript de DesarrolloWeb.com ya empezamos a explicar lo que son las estructuras de

control. En el presente artculo vamos a dedicarnos a mostrar cmo funciona la sentencia if, que es la
estructura ms habitual de las utilizadas para tomar decisiones en programas informticos.

IF es una estructura de control utilizada para tomar decisiones. Es un condicional que sirve para realizar
unas u otras operaciones en funcin de una expresin. Funciona de la siguiente manera, primero se evala
una expresin, si da resultado positivo se realizan las acciones relacionadas con el caso positivo.

La sintaxis de la estructura IF es la siguiente.

Nota: Todas las estructuras de control se escriben en minsculas en Javascript. Aunque algunas veces
para destacar el nombre de la estructura la podamos escribir en el texto del manual con letras
maysculas, en el cdigo de nuestros scripts siempre tenemos que ponerlo en minsculas. En caso
contrario recibiremos un mensaje de error.

if (expresin) {

//acciones a realizar en caso positivo

//...

Opcionalmente se pueden indicar acciones a realizar en caso de que la evaluacin de la sentencia devuelva

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 43 de 125

 Manual de JavaScript

resultados negativos.

if (expresin) {

//acciones a realizar en caso positivo

//...

} else {

//acciones a realizar en caso negativo

//...

Fijmonos en varias cosas. Para empezar vemos como con unas llaves engloban las acciones que queremos
realizar en caso de que se cumplan o no las expresiones. Estas llaves han de colocarse siempre, excepto en el
caso de que slo haya una instruccin como acciones a realizar, que son opcionales.

Nota: Aunque las llaves para englobar las sentencias a ejecutar tanto en el caso positivo como negativo
sean opcionales cuando queremos ejecutar una nica sentencia, la recomendacin es colocarlas siempre,
porque obtendremos as un cdigo fuente ms claro. Por ejemplo:

if (llueve)

alert("Cae agua");

Sera exactamente igual que este cdigo:

if (llueve){

alert("Cae agua");

O incluso, igual a este otro:

if (llueve) alert("Cae agua");

Sin embargo, cuando utilizamos las llaves, el cdigo queda bastante ms claro, porque se puede apreciar
en un rpido vistazo qu instrucciones estn dependiendo del caso positivo del if. Esto es un detalle que
ahora quizs no tenga mucha importancia, pero que se agradecer cuando el programa sea ms complejo
o cuando varios programadores se encarguen de tocar un mismo cdigo.

Otro detalle que salta a la vista es el sangrado (margen) que hemos colocado en cada uno de los bloques de
instrucciones a ejecutar en los casos positivos y negativos. Este sangrado es totalmente opcional, slo lo
hemos hecho as para que la estructura IF se comprenda de una manera ms visual. Los saltos de lnea
tampoco son necesarios y se han colocado tambin para que se vea mejor la estructura. Perfectamente
podramos colocar toda la instruccin IF en la misma lnea de cdigo, pero eso no ayudar a que las cosas
estn claras.

Nota: Nosotros, as como lo hara cualquier persona con cierta experiencia en el rea de programacin,
aconsejamos que se utilicen los sangrados y saltos de lnea necesarios para que las instrucciones se

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 44 de 125

 Manual de JavaScript

puedan entender mejor. Quizs el da que realizas un cdigo tengas claro qu has hecho y por qu es as,
pero dentro de un mes, cuando tengas que releer ese cdigo, quizs te acuerdes menos de lo que hiciste
en tus scripts y agradecers que tengan un formato amigable para que se puedan leer con facilidad por
las personas. Si trabajas en equipo estas recomendaciones sern todava ms importantes, puesto que
todava es ms complicado leer cdigo fuente que han realizado otras personas.

Veamos algn ejemplo de condicionales IF.

if (dia == "lunes")

document.write ("Que tengas un feliz comienzo de semana")

Si es lunes nos desear una feliz semana. No har nada en caso contrario. Como en este ejemplo slo
indicamos una instruccin para el caso positivo, no har falta utilizar las llaves (aunque s sera
recomendable haberlas puesto). Fjate tambin en el operador condicional que consta de dos signos igual.

Vamos a ver ahora otro ejemplo, un poco ms largo.

if (credito >= precio) {

document.write("has comprado el artculo " + nuevoArtculo) //enseo compra

carrito += nuevoArticulo //introduzco el artculo en el carrito de la compra

credito -= precio //disminuyo el crdito segn el precio del artculo

} else {

document.write("se te ha acabado el crdito") //informo que te falta dinero

window.location = "carritodelacompra.html" //voy a la pgina del carrito

Este ejemplo es un poco ms complejo, y tambin un poco ficticio. Lo que hago es comprobar si tengo
crdito para realizar una supuesta compra. Para ello miro si el crdito es mayor o igual que el precio del
artculo, si es as informo de la compra, introduzco el artculo en el carrito y resto el precio al crdito
acumulado. Si el precio del artculo es superior al dinero disponible informo de la situacin y mando al
navegador a la pgina donde se muestra su carrito de la compra.

Expresiones condicionales

La expresin a evaluar se coloca siempre entre parntesis y est compuesta por variables que se combinan
entre si mediante operadores condicionales. Recordamos que los operadores condicionales relacionaban dos
variables y devolvan siempre un resultado boleano. Por ejemplo un operador condicional es el operador "es
igual" (==), que devuelve true en caso de que los dos operandos sean iguales o false en caso de que sean
distintos.

if (edad > 18)

document.write("puedes ver esta pgina para adultos")

En este ejemplo utilizamos en operador condicional "es mayor" (>). En este caso, devuelve true si la
variable edad es mayor que 18, con lo que se ejecutara la lnea siguiente que nos informa de que se puede
ver el contenido para adultos.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 45 de 125

 Manual de JavaScript

Las expresiones condicionales se pueden combinar con las expresiones lgicas para crear expresiones ms
complejas. Recordamos que las expresiones lgicas son las que tienen como operandos a los boleanos y que
devuelvan otro valor boleano. Son los operadores negacin lgica, Y lgico y O lgico.

if (bateria < 0.5 && redElectrica == 0)

document.write("tu ordenador portatil se va a apagar en segundos")

Lo que hacemos es comprobar si la batera de nuestro supuesto ordenador es menor que 0.5 (est casi
acabada) y tambin comprobamos si el ordenador no tiene red elctrica (est desenchufado). Luego, el
operador lgico los relaciona con un Y, de modo que si est casi sin batera Y sin red elctrica, informo que
el ordenador se va a apagar.

Nota: La lista de operadores que se pueden utilizar con las estructuras IF se pueden ver en el captulo
de operadores condicionales y operadores lgicos.

La estructura if es de las ms utilizadas en lenguajes de programacin, para tomar decisiones en funcin de

la evaluacin de una sentencia. En el artculo anterior del Manual de Javascript ya comenzamos a explicar la
estructura if y ahora vamos a ver algunos usos un poquito ms avanzados.

Sentencias IF anidadas

Para hacer estructuras condicionales ms complejas podemos anidar sentencias IF, es decir, colocar
estructuras IF dentro de otras estructuras IF. Con un solo IF podemos evaluar y realizar una accin u otra
segn dos posibilidades, pero si tenemos ms posibilidades que evaluar debemos anidar IFs para crear el
flujo de cdigo necesario para decidir correctamente.

Por ejemplo, si deseo comprobar si un nmero es mayor menor o igual que otro, tengo que evaluar tres
posibilidades distintas. Primero puedo comprobar si los dos nmeros son iguales, si lo son, ya he resuelto el
problema, pero si no son iguales todava tendr que ver cul de los dos es mayor. Veamos este ejemplo en
cdigo Javascript.

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")

El flujo del programa es como comentbamos antes, primero se evala si los dos nmeros son iguales. En
caso positivo se muestra un mensaje informando de ello. En caso contrario ya sabemos que son distintos,

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 46 de 125

 Manual de JavaScript

pero aun debemos averiguar cul de los dos es mayor. Para eso se hace otra comparacin para saber si el
primero es mayor que el segundo. Si esta comparacin da resultados positivos mostramos un mensaje
diciendo que el primero es mayor que el segundo, en caso contrario indicaremos que el primero es menor
que el segundo.

Volvemos a remarcar que las llaves son en este caso opcionales, pues slo se ejecuta una sentencia para cada
caso. Adems, los saltos de lnea y los sangrados tambin opcionales en todo caso y nos sirven slo para ver
el cdigo de una manera ms ordenada. Mantener el cdigo bien estructurado y escrito de una manera
comprensible es muy importante, ya que nos har la vida ms agradable a la hora de programar y ms
adelante cuando tengamos que revisar los programas.

Nota: En este manual utilizar una notacin como la que has podido ver en las lneas anteriores.
Adems mantendr esa notacin en todo momento. Esto sin lugar a dudas har que los cdigos con
ejemplos sean comprensibles ms rpidamente, si no lo hiciramos as sera un verdadero incordio
leerlos. Esta misma receta es aplicable a los cdigos que has de crear t y el principal beneficiado sers
t mismo y los compaeros que lleguen a leer tu cdigo.

Operador IF

Hay un operador que no hemos visto todava y es una forma ms esquemtica de realizar algunos IF
sencillos. Proviene del lenguaje C, donde se escriben muy pocas lneas de cdigo y donde cuanto menos
escribamos ms elegantes seremos. Este operador es un claro ejemplo de ahorro de lneas y caracteres al
escribir los scripts. Lo veremos rpidamente, pues la nica razn por la que lo incluyo es para que sepas que
existe y si lo encuentras en alguna ocasin por ah sepas identificarlo y cmo funciona.

Un ejemplo de uso del operador IF se puede ver a continuacin.

Variable = (condicin) ? valor1 : valor2

Este ejemplo no slo realiza una comparacin de valores, adems asigna un valor a una variable. Lo que
hace es evaluar la condicin (colocada entre parntesis) y si es positiva asigna el valor1 a la variable y en caso
contrario le asigna el valor2. Veamos un ejemplo:

momento = (hora_actual < 12) ? "Antes del medioda" : "Despus del medioda"

Este ejemplo mira si la hora actual es menor que 12. Si es as, es que ahora es antes del medioda, as que
asigna "Antes del medioda" a la variable momento. Si la hora es mayor o igual a 12 es que ya es despus de
medioda, con lo que se asigna el texto "Despus del medioda" a la variable momento.

Para ampliar la informacin recomendamos ver tambin el Videotutorial de Javascript, en el vdeo donde
tratamos la estructura IF.

Este artculo es obra de Miguel Angel Alvarez

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 47 de 125

 Manual de JavaScript

Fue publicado por primera vez en 03/10/2001

Disponible online en http://desarrolloweb.com/articulos/20.php

Estructura IF (parte II)

Vemos ms cosas sobre la estructura IF: la anidacin de IFs y el operador ?, un IF sencillo.

La estructura if es de las ms utilizadas en lenguajes de programacin, para tomar decisiones en funcin de

la evaluacin de una sentencia. En el artculo anterior del Manual de Javascript ya comenzamos a explicar la
estructura if y ahora vamos a ver algunos usos un poquito ms avanzados.

Sentencias IF anidadas

Para hacer estructuras condicionales ms complejas podemos anidar sentencias IF, es decir, colocar
estructuras IF dentro de otras estructuras IF. Con un solo IF podemos evaluar y realizar una accin u otra
segn dos posibilidades, pero si tenemos ms posibilidades que evaluar debemos anidar IFs para crear el
flujo de cdigo necesario para decidir correctamente.

Por ejemplo, si deseo comprobar si un nmero es mayor menor o igual que otro, tengo que evaluar tres
posibilidades distintas. Primero puedo comprobar si los dos nmeros son iguales, si lo son, ya he resuelto el
problema, pero si no son iguales todava tendr que ver cul de los dos es mayor. Veamos este ejemplo en
cdigo Javascript.

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")

El flujo del programa es como comentbamos antes, primero se evala si los dos nmeros son iguales. En
caso positivo se muestra un mensaje informando de ello. En caso contrario ya sabemos que son distintos,
pero aun debemos averiguar cul de los dos es mayor. Para eso se hace otra comparacin para saber si el

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 48 de 125

 Manual de JavaScript

primero es mayor que el segundo. Si esta comparacin da resultados positivos mostramos un mensaje
diciendo que el primero es mayor que el segundo, en caso contrario indicaremos que el primero es menor
que el segundo.

Volvemos a remarcar que las llaves son en este caso opcionales, pues slo se ejecuta una sentencia para cada
caso. Adems, los saltos de lnea y los sangrados tambin opcionales en todo caso y nos sirven slo para ver
el cdigo de una manera ms ordenada. Mantener el cdigo bien estructurado y escrito de una manera
comprensible es muy importante, ya que nos har la vida ms agradable a la hora de programar y ms
adelante cuando tengamos que revisar los programas.

Nota: En este manual utilizar una notacin como la que has podido ver en las lneas anteriores.
Adems mantendr esa notacin en todo momento. Esto sin lugar a dudas har que los cdigos con
ejemplos sean comprensibles ms rpidamente, si no lo hiciramos as sera un verdadero incordio
leerlos. Esta misma receta es aplicable a los cdigos que has de crear t y el principal beneficiado sers
t mismo y los compaeros que lleguen a leer tu cdigo.

Operador IF

Hay un operador que no hemos visto todava y es una forma ms esquemtica de realizar algunos IF
sencillos. Proviene del lenguaje C, donde se escriben muy pocas lneas de cdigo y donde cuanto menos
escribamos ms elegantes seremos. Este operador es un claro ejemplo de ahorro de lneas y caracteres al
escribir los scripts. Lo veremos rpidamente, pues la nica razn por la que lo incluyo es para que sepas que
existe y si lo encuentras en alguna ocasin por ah sepas identificarlo y cmo funciona.

Un ejemplo de uso del operador IF se puede ver a continuacin.

Variable = (condicin) ? valor1 : valor2

Este ejemplo no slo realiza una comparacin de valores, adems asigna un valor a una variable. Lo que
hace es evaluar la condicin (colocada entre parntesis) y si es positiva asigna el valor1 a la variable y en caso
contrario le asigna el valor2. Veamos un ejemplo:

momento = (hora_actual < 12) ? "Antes del medioda" : "Despus del medioda"

Este ejemplo mira si la hora actual es menor que 12. Si es as, es que ahora es antes del medioda, as que
asigna "Antes del medioda" a la variable momento. Si la hora es mayor o igual a 12 es que ya es despus de
medioda, con lo que se asigna el texto "Despus del medioda" a la variable momento.

En el Manual de Javascript de DesarrolloWeb.com ya empezamos a explicar lo que son las estructuras de

control. En el presente artculo vamos a dedicarnos a mostrar cmo funciona la sentencia if, que es la
estructura ms habitual de las utilizadas para tomar decisiones en programas informticos.

IF es una estructura de control utilizada para tomar decisiones. Es un condicional que sirve para realizar
unas u otras operaciones en funcin de una expresin. Funciona de la siguiente manera, primero se evala

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 49 de 125

 Manual de JavaScript

una expresin, si da resultado positivo se realizan las acciones relacionadas con el caso positivo.

La sintaxis de la estructura IF es la siguiente.

Nota: Todas las estructuras de control se escriben en minsculas en Javascript. Aunque algunas veces
para destacar el nombre de la estructura la podamos escribir en el texto del manual con letras
maysculas, en el cdigo de nuestros scripts siempre tenemos que ponerlo en minsculas. En caso
contrario recibiremos un mensaje de error.

if (expresin) {

//acciones a realizar en caso positivo

//...

Opcionalmente se pueden indicar acciones a realizar en caso de que la evaluacin de la sentencia devuelva
resultados negativos.

if (expresin) {

//acciones a realizar en caso positivo

//...

} else {

//acciones a realizar en caso negativo

//...

Fijmonos en varias cosas. Para empezar vemos como con unas llaves engloban las acciones que queremos
realizar en caso de que se cumplan o no las expresiones. Estas llaves han de colocarse siempre, excepto en el
caso de que slo haya una instruccin como acciones a realizar, que son opcionales.

Nota: Aunque las llaves para englobar las sentencias a ejecutar tanto en el caso positivo como negativo
sean opcionales cuando queremos ejecutar una nica sentencia, la recomendacin es colocarlas siempre,
porque obtendremos as un cdigo fuente ms claro. Por ejemplo:

Veamos el cdigo siguiente:

if (llueve)

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 50 de 125

 Manual de JavaScript

alert("Cae agua");

Sera exactamente igual que este cdigo:

if (llueve){

alert("Cae agua");

O incluso, igual a este otro:

if (llueve) alert("Cae agua");

Sin embargo, cuando utilizamos las llaves, el cdigo queda bastante ms claro, porque se puede apreciar
en un rpido vistazo qu instrucciones estn dependiendo del caso positivo del if. Esto es un detalle que
ahora quizs no tenga mucha importancia, pero que se agradecer cuando el programa sea ms complejo
o cuando varios programadores se encarguen de tocar un mismo cdigo.

Otro detalle que salta a la vista es el sangrado (margen) que hemos colocado en cada uno de los bloques de
instrucciones a ejecutar en los casos positivos y negativos. Este sangrado es totalmente opcional, slo lo
hemos hecho as para que la estructura IF se comprenda de una manera ms visual. Los saltos de lnea
tampoco son necesarios y se han colocado tambin para que se vea mejor la estructura. Perfectamente
podramos colocar toda la instruccin IF en la misma lnea de cdigo, pero eso no ayudar a que las cosas
estn claras.

Nota: Nosotros, as como lo hara cualquier persona con cierta experiencia en el rea de programacin,
aconsejamos que se utilicen los sangrados y saltos de lnea necesarios para que las instrucciones se
puedan entender mejor. Quizs el da que realizas un cdigo tengas claro qu has hecho y por qu es as,
pero dentro de un mes, cuando tengas que releer ese cdigo, quizs te acuerdes menos de lo que hiciste
en tus scripts y agradecers que tengan un formato amigable para que se puedan leer con facilidad por
las personas. Si trabajas en equipo estas recomendaciones sern todava ms importantes, puesto que
todava es ms complicado leer cdigo fuente que han realizado otras personas.

Veamos algn ejemplo de condicionales IF.

if (dia == "lunes")

document.write ("Que tengas un feliz comienzo de semana")

Si es lunes nos desear una feliz semana. No har nada en caso contrario. Como en este ejemplo slo
indicamos una instruccin para el caso positivo, no har falta utilizar las llaves (aunque s sera
recomendable haberlas puesto). Fjate tambin en el operador condicional que consta de dos signos igual.

Vamos a ver ahora otro ejemplo, un poco ms largo.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 51 de 125

 Manual de JavaScript

if (credito >= precio) {

document.write("has comprado el artculo " + nuevoArtculo) //enseo compra

carrito += nuevoArticulo //introduzco el artculo en el carrito de la compra

credito -= precio //disminuyo el crdito segn el precio del artculo

} else {

document.write("se te ha acabado el crdito") //informo que te falta dinero

window.location = "carritodelacompra.html" //voy a la pgina del carrito

Este ejemplo es un poco ms complejo, y tambin un poco ficticio. Lo que hago es comprobar si tengo
crdito para realizar una supuesta compra. Para ello miro si el crdito es mayor o igual que el precio del
artculo, si es as informo de la compra, introduzco el artculo en el carrito y resto el precio al crdito
acumulado. Si el precio del artculo es superior al dinero disponible informo de la situacin y mando al
navegador a la pgina donde se muestra su carrito de la compra.

Expresiones condicionales

La expresin a evaluar se coloca siempre entre parntesis y est compuesta por variables que se combinan
entre si mediante operadores condicionales. Recordamos que los operadores condicionales relacionaban dos
variables y devolvan siempre un resultado boleano. Por ejemplo un operador condicional es el operador "es
igual" (==), que devuelve true en caso de que los dos operandos sean iguales o false en caso de que sean
distintos.

if (edad > 18)

document.write("puedes ver esta pgina para adultos")

En este ejemplo utilizamos en operador condicional "es mayor" (>). En este caso, devuelve true si la
variable edad es mayor que 18, con lo que se ejecutara la lnea siguiente que nos informa de que se puede
ver el contenido para adultos.

Las expresiones condicionales se pueden combinar con las expresiones lgicas para crear expresiones ms
complejas. Recordamos que las expresiones lgicas son las que tienen como operandos a los boleanos y que
devuelvan otro valor boleano. Son los operadores negacin lgica, Y lgico y O lgico.

if (bateria < 0.5 && redElectrica == 0)

document.write("tu ordenador portatil se va a apagar en segundos")

Lo que hacemos es comprobar si la batera de nuestro supuesto ordenador es menor que 0.5 (est casi

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 52 de 125

 Manual de JavaScript

acabada) y tambin comprobamos si el ordenador no tiene red elctrica (est desenchufado). Luego, el
operador lgico los relaciona con un Y, de modo que si est casi sin batera Y sin red elctrica, informo que
el ordenador se va a apagar.

Nota: La lista de operadores que se pueden utilizar con las estructuras IF se pueden ver en el captulo
de operadores condicionales y operadores lgicos.

En el siguiente artculo seguiremos explicando usos avanzados de la estructura de control if en Javascript,

como la anidacin de estructuras if. As mismo, recomendamos ver tambin el Videotutorial de Javascript,
en el vdeo donde tratamos la estructura IF.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 03/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Estructura SWITCH de Javascript

La estructura de control switch de Javascript es utilizada para tomar decisiones en funcin de
distintos estados o valores de una variable.

Las estructuras de control son la manera con la que se puede dominar el flujo de los programas, para hacer
cosas distintas en funcin de los estados de las variables. En el Manual de Javascript ya empezamos a ver las
estructuras de control y ahora le ha tocado el turno a SWITCH, una estructura un poco ms compleja que
permite hacer mltiples operaciones dependiendo del estado de una variable.

En este artculo veremos que switch nos sirve para tomar decisiones en funcin de distintos estados de las
variables. Esta expresin se utiliza cuando tenemos mltiples posibilidades como resultado de la evaluacin
de una sentencia.

La estructura SWITCH se incorpor a partir de la versin 1.2 de Javascript (Netscape 4 e Internet Explorer
4). Su sintaxis es la siguiente.

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

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 53 de 125

 Manual de JavaScript

La expresin se evala, si vale valor1 se ejecutan las sentencias relacionadas con ese caso. Si la expresin
vale valor2 se ejecutan las instrucciones relacionadas con ese valor y as sucesivamente, por tantas opciones
como deseemos. Finalmente, para todos los casos no contemplados anteriormente se ejecuta el caso por
defecto.

La palabra break es opcional, pero si no la ponemos a partir de que se encuentre coincidencia con un valor
se ejecutarn todas las sentencias relacionadas con este y todas las siguientes. Es decir, si en nuestro
esquema anterior no hubiese ningn break y la expresin valiese valor1, se ejecutaran las sentencias
relacionadas con valor1 y tambin las relacionadas con valor2, valor3 y default.

Tambin es opcional la opcin default u opcin por defecto.

Veamos un ejemplo de uso de esta estructura. Supongamos que queremos indicar que da de la semana es.
Si el da es 1 (lunes) sacar un mensaje indicndolo, si el da es 2 (martes) debemos sacar un mensaje distinto
y as sucesivamente para cada da de la semana, menos en el 6 (sbado) y 7 (domingo) que queremos
mostrar el mensaje "es fin de semana". Para das mayores que 7 indicaremos que ese da no existe.

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 ejemplo es relativamente sencillo, solamente puede tener una pequea dificultad, consistente en
interpretar lo que pasa en el caso 6 y 7, que habamos dicho que tenamos que mostrar el mismo mensaje.
En el caso 6 en realidad no indicamos ninguna instruccin, pero como tampoco colocamos un break se
ejecutar la sentencia o sentencias del caso siguiente, que corresponden con la sentencia indicada en el caso
7 que es el mensaje que informa que es fin de semana. Si el caso es 7 simplemente se indica que es fin de
semana, tal como se pretenda.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 54 de 125

 Manual de JavaScript

Nota: Adems contamos con un videotutorial sobre el SWITCH en Javascript que os puede ser de
mucha ayuda para entenderlo todo mucho mejor.

En el siguiente artculo comenzaremos a explorar las estructuras de control para hacer bucles o repeticiones
en Javascript, comenzando por el bucle for.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 03/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Bucle FOR en Javascript

Descripcin y ejemplos de funcionamiento del bucle FOR.

Comenzamos con este artculo del Manual de Javascript a explorar las estructuras de control para producir
bucles o repeticiones, comenzando por el bucle for, no por ser el ms simple, pero s el ms utilizado en la
programacin.

El bucle FOR se utiliza para repetir una o ms instrucciones un determinado nmero de veces. De
entre todos los bucles, el FOR se suele utilizar cuando sabemos seguro el nmero de veces que queremos
que se ejecute. La sintaxis del bucle for se muestra a continuacin.

for (inicializacin; condicin; actualizacin) {

//sentencias a ejecutar en cada iteracin

El bucle FOR tiene tres partes incluidas entre los parntesis, que nos sirven para definir cmo deseamos
que se realicen las repeticiones. La primera parte es la inicializacin, que se ejecuta solamente al comenzar la
primera iteracin del bucle. En esta parte se suele colocar la variable que utilizaremos para llevar la cuenta
de las veces que se ejecuta el bucle.

La segunda parte es la condicin, que se evaluar cada vez que comience una iteracin del bucle. Contiene
una expresin para decidir cundo se ha de detener el bucle, o mejor dicho, la condicin que se debe
cumplir para que contine la ejecucin del bucle.

Por ltimo tenemos la actualizacin, que sirve para indicar los cambios que queramos ejecutar en las
variables cada vez que termina la iteracin del bucle, antes de comprobar si se debe seguir ejecutando.

Despus del for se colocan las sentencias que queremos que se ejecuten en cada iteracin, acotadas entre
llaves.

Un ejemplo de utilizacin de este bucle lo podemos ver a continuacin, donde se imprimirn los nmeros
del 0 al 10.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 55 de 125

 Manual de JavaScript

var i

for (i=0;i<=10;i++) {

document.write(i)

document.write("<br>")

En este caso se inicializa la variable i a 0. Como condicin para realizar una iteracin, se tiene que cumplir
que la variable i sea menor o igual que 10. Como actualizacin se incrementar en 1 la variable i.

Como se puede comprobar, este bucle es muy potente, ya que en una sola lnea podemos indicar
muchas cosas distintas y muy variadas, lo que permite una rpida configuracin del bucle y una
versatilidad enorme.

Por ejemplo si queremos escribir los nmero del 1 al 1.000 de dos en dos se escribir el siguiente bucle.

for (i=1;i<=1000;i+=2)

document.write(i)

Si nos fijamos, en cada iteracin actualizamos el valor de i incrementndolo en 2 unidades.

Nota: Otro detalle, no utilizamos las llaves englobando las instrucciones del bucle FOR porque slo
tiene una sentencia y en este caso no es obligado, tal como pasaba con las instrucciones del IF.

Si queremos contar descendentemente del 343 al 10 utilizaramos este bucle.

for (i=343;i>=10;i--)

document.write(i)

En este caso decrementamos en una unidad la variable i en cada iteracin, comenzando en el valor 343 y
siempre que la variable tenga un valor mayor o igual que 10.

Ejercicio de ejemplo del bucle for

Vamos a hacer una pausa para asimilar el bucle for con un ejercicio que no encierra ninguna dificultad si
hemos entendido el funcionamiento del bucle.

Se trata de hacer un bucle que escriba en una pgina web los encabezamientos desde <H1> hasta <H6> con
un texto que ponga "Encabezado de nivel x".

Lo que deseamos escribir en una pgina web mediante Javascript es lo siguiente:

<H1>Encabezado de nivel 1</H1>

<H2>Encabezado de nivel 2</H2>

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 56 de 125

 Manual de JavaScript

<H3>Encabezado de nivel 3</H3>

<H4>Encabezado de nivel 4</H4>

<H5>Encabezado de nivel 5</H5>

<H6>Encabezado de nivel 6</H6>

Para ello tenemos que hacer un bucle que empiece en 1 y termine en 6 y en cada iteracin escribiremos el
encabezado que toca.

for (i=1;i<=6;i++) {

document.write("<H" + i + ">Encabezado de nivel " + i + "</H" + i + ">")

Este script se puede ver en funcionamiento aqu.

Ahora que ya conocemos el bucle for, estamos en condiciones de aprender a manejar otras estructuras de
control para realizar repeticiones, como los bucles while y do...while.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 18/10/2001
Disponible online en http://desarrolloweb.com/articulos/bucle-for-javascript.html

Bucles WHILE y DO WHILE

Descripcin y diferentes usos de los dos tipos de bucles WHILE que se encuentran disponibles en
Javascript, con algunos ejemplos prcticos.

Estamos tratando acerca de las distintas estructuras de control que existen en el lenguaje Javascript y en
concreto viendo los distintos tipos de bucles que podemos implementar en este lenguaje de programacin.
En artculos anteriores del Manual de Javascript vimos ya el primero de los bucles que debemos conocer, el
bucle for y ahora vamos a tratar sobre los otros dos tipos de estructuras de control para hacer repeticiones.
As pues, veamos ahora los dos tipos de bucles WHILE que podemos utilizar en Javascript y los usos de
cada uno.

Bucle WHILE

Estos bucles se utilizan cuando queremos repetir la ejecucin de unas sentencias un nmero indefinido de
veces, siempre que se cumpla una condicin. Se ms sencillo de comprender que el bucle FOR, pues no
incorpora en la misma lnea la inicializacin de las variables su condicin para seguir ejecutndose y su
actualizacin. Slo se indica, como veremos a continuacin, la condicin que se tiene que cumplir para que
se realice una iteracin.

while (condicin){

//sentencias a ejecutar

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 57 de 125

 Manual de JavaScript

Un ejemplo de cdigo donde se utiliza este bucle se puede ver a continuacin.

var color = ""

while (color != "rojo"){

color = prompt("dame un color (escribe rojo para salir)","")

Este es un ejemplo de lo ms sencillo que se puede hacer con un bucle while. Lo que hace es pedir que el
usuario introduzca un color y lo hace repetidas veces, mientras que el color introducido no sea rojo. Para
ejecutar un bucle como este primero tenemos que inicializar la variable que vamos utilizar en la condicin
de iteracin del bucle. Con la variable inicializada podemos escribir el bucle, que comprobar para ejecutarse
que la variable color sea distinto de "rojo". En cada iteracin del bucle se pide un nuevo color al usuario
para actualizar la variable color y se termina la iteracin, con lo que retornamos al principio del bucle, donde
tenemos que volver a evaluar si lo que hay en la variable color es "rojo" y as sucesivamente mientras que no
se haya introducido como color el texto "rojo".

Nota: Hemos utilizado en este ejemplo la funcin prompt de Javascript, que no hemos visto todava en
este manual. Esta funcin sirve para que mostrar una caja de dilogo donde el usuario debe escribir un
texto. Esta funcin pertenece al objeto window de Javascript y la comentamos en el artculo Mtodos de
window en Javascript.

Bucle DO...WHILE

El bucle do...while es la ltima de las estructuras para implementar repeticiones de las que dispone en
Javascript y es una variacin del bucle while visto anteriormente. Se utiliza generalmente cuando no
sabemos cuantas veces se habr de ejecutar el bucle, igual que el bucle WHILE, con la diferencia de que
sabemos seguro que el bucle por lo menos se ejecutar una vez.

Este tipo de bucle se introdujo en Javascript 1.2, por lo que no todos los navegadores los soportan, slo los
de versin 4 o superior. En cualquiuer caso, cualquier cdigo que quieras escribir con DO...WHILE se
puede escribir tambin utilizando un bucle WHILE, con lo que en navegadores antiguos debers traducir tu
bucle DO...WHILE por un bucle WHILE.

La sintaxis es la siguiente:

do {

//sentencias del bucle

} while (condicin)

El bucle se ejecuta siempre una vez y al final se evala la condicin para decir si se ejecuta otra vez el bucle
o se termina su ejecucin.

Veamos el ejemplo que escribimos para un bucle WHILE en este otro tipo de bucle.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 58 de 125

 Manual de JavaScript

var color

do {

color = prompt("dame un color (escribe rojo para salir)","")

} while (color != "rojo")

Este ejemplo funciona exactamente igual que el anterior, excepto que no tuvimos que inicializar la variable
color antes de introducirnos en el bucle. Pide un color mientras que el color introducido es distinto que
"rojo".

Ejemplo de uso de los bucles while

Vamos a ver a continuacin un ejemplo ms prctico sobre cmo trabajar con un bucle WHILE. Como
resulta muy difcil hacer ejemplos prcticos con lo poco que sabemos sobre Javascript, vamos a adelantar
una instruccin que aun no conocemos.

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 (depender de los valores aleatorios que se vayan
obteniendo).

var suma = 0

while (suma < 1000){

suma += parseInt(Math.random() * 100)

document.write (suma + "<br>")

Suponemos que por lo que respecta al bucle WHILE no habr problemas, pero donde si que puede
haberlos es en la sentencia utilizada para tomar un nmero aleatorio. Sin embargo, no es necesario explicar
aqu la sentencia porque lo tenemos planeado hacer ms adelante. De todos modos, si lo deseas, puedes ver
este artculo que habla sobre nmeros aleatorios en Javascript.

Podemos ver una pgina con el ejemplo en funcionamiento.

Con esto ya hemos conocido todos los tipos de bucles que existen en Javascript, no obstante aun vamos a
dedicar un artculo para explicar las sentencias break y continue que nos sirven para alterar el
funcionamiento normal de los bucles en dos sentidos.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 18/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Break y continue

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 59 de 125

 Manual de JavaScript

Dos instrucciones que aumentan el control sobre los bucles en Javascript. Sirven para parar y
continuar con la siguiente iteracin del bucle respectivamente.

Javascript tiene diferentes estructuras de control para implementar bucles, como FOR, WHILE y
DO...WHILE, que ya hemos podido explicar en captulos anteriores del Manual de Javascript. Como hemos
podido comprobar, con estos bucles podemos abarcar gran cantidad de necesidades, pero quizs con el
tiempo encuentres que te faltan algunas posibilidades de control de las repeticiones de los bucles.

Imagina por ejemplo que estas haciendo un bucle muy largo para encontrar algo en cientos o miles de sitios.
Pero ponte en el caso que durante las primeras iteraciones encuentres ese valor que buscabas. Entonces no
tendra sentido continuar con el resto del bucle para buscar ese elemento, pues ya lo habas encontrado. En
estas situaciones nos conviene saber para el bucle cancelar el resto de iteraciones. Obviamente, sto es solo
un ejemplo de cmo podramos vernos en la necesidad de controlar un poco ms el bucle. En la vida real
como programador encontrars muchas otras ocasiones en las que te interesar hacer esto u otras cosas con
ellos.

As pues, existen dos instrucciones que se pueden usar en de las distintas estructuras de control y
principalmente en los bucles, que te servirn para controlar dos tipos de situaciones. Son las instrucciones
break y continue.:

break: Significa detener la ejecucin de un bucle y salirse de l.

continue: Sirve para detener la iteracin actual y volver al principio del bucle para realizar otra
iteracin, si corresponde.

Break

Se detiene un bucle utilizando la palabra break. Detener un bucle significa salirse 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 = prompt("dime si continuo preguntando...", "si")

if (escribe == "no")

break

Este ejemplo escribe los nmeros del 0 al 9 y en cada iteracin del bucle pregunta al usuario si desea
continuar. Si el usuario dice cualquier cosa continua, excepto cuando dice "no", situacin en la cual se sale
del bucle y deja la cuenta por donde se haba quedado.

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 = prompt("La cuenta est en " + i + ", dime si incremento", "si")

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 60 de 125

 Manual de JavaScript

if (incrementar == "no")

continue

i++

Este ejemplo, en condiciones normales contara hasta desde i=0 hasta i=7, pero cada vez que se ejecuta el
bucle pregunta al usuario si desea incrementar la variable o no. Si introduce "no" se ejecuta la sentencia
continue, con lo que se vuelve al principio del bucle sin llegar a incrementar en 1 la variable i, ya que se
ignoraran las sentencia que hayan por debajo del continue.

Ejemplo adicional de la sentencia break

Un ejemplo ms prctico sobre estas instrucciones se puede ver a continuacin. Se trata de un bucle 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;

Podemos ver una pgina con el ejemplo en funcionamiento.

Con la descripcin de las sentencias break y continue hemos podido abarcar todo lo que se debe saber
sobre la creacin de bucles en Javascript. Ahora bien, en el siguiente artculo todava vamos a seguir en el
tema de las estructuras de control, porque queremos ofrecer un ejemplo un poco ms avanzado donde
aprenderemos a anidar bucles.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 18/10/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Bucles anidados en Javascript

Explicamos lo que es un bucle anidado, cmo funcionan y para qu sirven. Vemos algunos
ejemplos.

En el Manual de Javascript hemos recorrido ya diversos artculos para hablar de bucles. En este momento
no debera haber ningn problema para poder crear los distintos tipos de bucles sin problemas, no obstante,
queremos dedicar un artculo completo a tratar acerca de uno de los usos ms habituales de los bucles, que
podremos encontrar cuando estemos haciendo programas ms complejos: la anidacin de bucles.

Anidar un bucle consiste en meter ese bucle dentro de otro. La anidacin de bucles es necesaria para
hacer determinados procesamientos un poco ms complejos que los que hemos visto en los ejemplos
anteriores. Si en vuestra experiencia como programadores los habis anidado un bucle todava, tener certeza

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 61 de 125

 Manual de JavaScript

que ms tarde o temprano os encontraris con esa necesidad.

Un bucle anidado tiene una estructura como la que sigue. Vamos a tratar de explicarlo a la vista de estas
lneas:

for (i=0;i<10;i++){

for (j=0;j<10;j++) {

document.write(i + "-" + j)

La ejecucin funcionar de la siguiente manera. Para empezar se inicializa el primer bucle, con lo que la
variable i valdr 0 y a continuacin se inicializa el segundo bucle, con lo que la variable j valdr tambin 0.
En cada iteracin se imprime el valor de la variable i, un guin ("-") y el valor de la variable j, como las dos
variables valen 0, se imprimir el texto "0-0" en la pgina web.

Debido al flujo del programa en esquemas de anidacin como el que hemos visto, el bucle que est anidado
(ms hacia dentro) es el que ms veces se ejecuta. En este ejemplo, para cada iteracin del bucle ms
externo el bucle anidado se ejecutar por completo una vez, es decir, har sus 10 iteraciones. En la pgina
web se escribiran estos valores, en la primera iteracin del bucle externo y desde el principio:

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

Para cada iteracin del bucle externo se ejecutarn las 10 iteraciones del bucle interno o anidado. Hemos
visto la primera iteracin, ahora vamos a ver las siguientes iteraciones del bucle externo. En cada una
acumula una unidad en la variable i, con lo que saldran estos valores.

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

Y luego estos:

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

As hasta que se terminen los dos bucles, que sera cuando se alcanzase el valor 9-9.

Veamos un ejemplo muy parecido al anterior, aunque un poco ms til. Se trata de 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>")

Con el primer bucle controlamos la tabla actual y con el segundo bucle la desarrollamos. En el primer bucle

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 62 de 125

 Manual de JavaScript

escribimos una cabecera, en negrita, indicando la tabla que estamos escribiendo, primero la del 1 y luego las
dems en orden ascendente hasta el 9. Con el segundo bucle escribo cada uno de los valores de cada tabla.
Se puede ver el ejemplo en marcha en este enlace.

Nota: Veremos ms cosas con bucles anidados en captulos posteriores, aunque si queremos
adelantarnos un poco para ver un nuevo ejemplo que afiance estos conocimientos podemos ir viendo
un ejemplo en el Taller de Javascript sobre bucles anidados, donde se construye la tabla con todos los
colores puros en definiciones de 256 colores.

Con este artculo ms bien prctico sobre anidacin de bucles, terminamos el tema de las estructuras de
control. Ahora pasaremos a otra seccin de este Manual de Javascript, en la que trataremos sobre las
funciones.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 10/12/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 63 de 125

 Manual de JavaScript

Funciones en Javascript

Las funciones nos permitirn hacer programas y scripts ms optimizados y de fcil mantenimiento.
Tambin son bsicas en cualquier lenguaje de programacin y les dedicaremos varios artculos.

Funciones en Javascript
Comenzamos con las funciones en Javascript. Definimos el concepto de funcin y aprendemos a
crearlas y a llamarlas.

Seguimos trabajando y ampliando nuestros conocimientos sobre Javascript. Con lo visto hasta ahora en el
Manual de Javascript ya tenemos una cierta soltura para trabajar en este interesante lenguaje de
programacin. Pero todava nos queda mucho por delante.

Ahora vamos a ver un tema muy importante, sobretodo para los que no han programado nunca y con
Javascript estn dando sus primeros pasos en el mundo de la programacin ya que veremos un concepto
nuevo, el de funcin, y los usos que tiene. Para los que ya conozcan el concepto de funcin tambin ser un
captulo til, pues tambin veremos la sintaxis y funcionamiento de las funciones en Javascript.

Qu es una funcin

A la hora de hacer un programa ligeramente grande existen determinados procesos que se pueden concebir
de forma independiente, y que son ms sencillos de resolver que el problema entero. Adems, estos suelen
ser realizados repetidas veces a lo largo de la ejecucin del programa. Estos procesos se pueden agrupar en
una funcin, definida para que no tengamos que repetir una y otra vez ese cdigo en nuestros scripts, sino
que simplemente llamamos a la funcin y ella se encarga de hacer todo lo que debe.

As que podemos ver una funcin como una serie de instrucciones que englobamos dentro de un mismo
proceso. Este proceso se podr luego ejecutar desde cualquier otro sitio con solo llamarlo. Por ejemplo, en
una pgina web puede haber una funcin para cambiar el color del fondo y desde cualquier punto de la
pgina podramos llamarla para que nos cambie el color cuando lo deseemos.

Nota: Si queremos, podemos ampliar esta descripcin de las funciones en el artculo Concepto de
funcin.

Las funciones se utilizan constantemente, no slo las que escribes t, sino tambin las que ya estn definidas
en el sistema, pues todos los lenguajes de programacin suelen tener un montn de funciones para realizar
procesos habituales, como por ejemplo obtener la hora, imprimir un mensaje en la pantalla o convertir
variables de un tipo a otro. Ya hemos visto alguna funcin en nuestros sencillos ejemplos anteriores. Por
ejemplo, cuando hacamos un document.write() en realidad estbamos llamando a la funcin write()

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 64 de 125

 Manual de JavaScript

asociada al documento de la pgina, que escribe un texto en la pgina.

En los captulos de funciones vamos primero a ver cmo realizar nuestras propias funciones y cmo
llamarlas luego. A lo largo del manual veremos muchas de las funciones definidas en Javascript que
debemos utilizar para realizar distintos tipos de acciones habituales.

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

...

Primero se escribe la palabra function, reservada para este uso. Seguidamente se escribe el nombre de la
funcin, que como los nombres de variables puede tener nmeros, letras y algn carcter adicional como en
guin bajo. A continuacin se colocan entre llaves las distintas instrucciones de la funcin. Las llaves en el
caso de las funciones no son opcionales, adems es til colocarlas siempre como se ve en el ejemplo, para
que se reconozca fcilmente la estructura de instrucciones que engloba la funcin.

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>")

Simplemente escribe en la pgina un texto. Admitimos que es una funcin tan sencilla, que el ejemplo no
expresa suficientemente el concepto de funcin, pero ya veremos otras ms complejas. Las etiquetas H1 no
se muestran en la pgina, sino que son interpretadas como el significado de la misma, en este caso que
escribimos un encabezado de nivel 1. Como estamos escribiendo en una pgina web, al poner etiquetas
HTML se interpretan como lo que son.

Cmo llamar a una funcin

Para ejecutar una funcin la tenemos que invocar en cualquier parte de la pgina. Con eso conseguiremos
que se ejecuten todas las instrucciones que tiene la funcin entre las dos llaves.

Para ejecutar la funcin utilizamos su nombre seguido de los parntesis. Por ejemplo, as llamaramos a la
funcin escribirBienvenida() que acabamos de crear.

escribirBienvenida()

Luego veremos que existen muchas cosas adicionales que debemos conocer de las funciones, como el paso
de parmetros o los valores de retorno. Pero antes vamos a explicar dnde debemos colocar las funciones

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 65 de 125

 Manual de JavaScript

Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 02/11/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Dnde colocamos las funciones Javascript

Vemos la manera de incluir funciones Javascript, de cliente, dentro de las pginas web.

Las funciones son uno de los principales componentes de los programas, en la mayora de los lenguajes de
programacin. En el Manual de Javascript ya hemos comenzado a explicar qu es una funcin y cmo
podemos crearla e invocarla en este lenguaje. Ahora vamos a tratar un tema que no es tanto de sintaxis y
programacin, sino que tiene ms que ver con el uso correcto y habitual que se hace de las funciones en
Javascript, que no es otro que la colocacin del cdigo de las funciones en la pgina web.

En principio, 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. Te adelantamos que lo ms fcil es colocar la funcin antes de cualquier llamada a
la misma y as seguro que nunca nos equivocaremos.

Existen dos opciones posibles para colocar el cdigo de una funcin:

a) Colocar la funcin en el mismo bloque de script: En concreto, la funcin se puede definir en el

bloque <SCRIPT> donde est la llamada a la funcin, aunque es indiferente si la llamada se encuentra antes o
despus del cdigo de la funcin, dentro del mismo bloque <SCRIPT>.

<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.

b) Colocar la funcin en otro bloque de script: 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...

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 66 de 125

 Manual de JavaScript

document.write("Esto va bien")

</SCRIPT>

</HEAD>

<BODY>

<SCRIPT>

miFuncion()

</SCRIPT>

</BODY>

</HTML>

Vemos un cdigo completo sobre cmo podra ser una pgina web donde tenemos funciones Javascript.
Como se puede comprobar, las funciones estn en la cabecera de la pgina (dentro del HEAD). ste es un
lugar excelente donde colocarlas, porque se supone que en la cabecera no se van a utilizar todava y siempre
podremos disfrutar de ellas en el cuerpo porque sabemos seguro que ya han sido declaradas.

Para que quede claro este asunto de la colocacin de funciones veamos el siguiente ejemplo, que dara un
error. Examina atentamente el cdigo siguiente, que lanzar un error, debido a que hacemos 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>

Con esto esperamos haber resuelto todas las dudas sobre la colocacin del cdigo de las funciones
Javascript. En siguientes artculos veremos otros temas interesantes como los parmetros de las funciones.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 02/11/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Parmetros de las funciones

Vemos lo que son los parmetros en las funciones. Vemos como definir funciones que reciben
parmetros en el lenguaje Javascript y como hacer llamadas a funciones pasando parmetros.

En el Manual de Javascript hemos hablado anteriormente sobre funciones. En concreto este es el tercer
artculo que abordamos sobre el tema.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 67 de 125

 Manual de JavaScript

Las ideas que hemos explicado anteriormente sobre funciones no son las nicas que debemos aprender para
manejarlas en toda su potencia. Las funciones tambin tienen una entrada y una salida de datos. En este
artculo veremos cmo podemos enviar datos a las funciones Javascript.

Parmetros

Los parmetros se usan para mandar valores a las funciones. Una funcin trabajar con los parmetros para
realizar las acciones. Por decirlo de otra manera, los parmetros son los valores de entrada que recibe una
funcin.

Por poner un ejemplo sencillo de entender, una funcin que realizase una suma de dos nmeros tendra
como parmetros a esos dos nmeros. Los dos nmeros son la entrada, as como la salida sera el resultado
de la suma, pero eso lo veremos ms tarde.

Veamos un ejemplo anterior en el que crebamos 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>")

Como podemos ver en el ejemplo, para definir en la funcin un parmetro tenemos que poner el nombre
de la variable que va a almacenar el dato que le pasemos. Esa variable, que en este caso se llama nombre,
tendr como valor el dato que le pasemos a la funcin cuando la llamemos. Adems, la variable donde
recibimos el parmetro tendr vida durante la ejecucin de la funcin y dejar de existir cuando la funcin
termine su ejecucin.

Para llamar a una funcin que tiene parmetros se coloca entre parntesis el valor del parmetro. Para llamar
a la funcin del ejemplo habra que escribir:

escribirBienvenida("Alberto Garca")

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>.

Los parmetros pueden recibir cualquier tipo de datos, numrico, textual, boleano o un objeto. Realmente
no especificamos el tipo del parmetro, por eso debemos tener un cuidado especial al definir las acciones
que realizamos dentro de la funcin y al pasarle valores, para asegurarnos que todo es consecuente con los
tipos de datos que esperamos tengan nuestras variables o parmetros.

Mltiples parmetros

Una funcin puede recibir tantos parmetros como queramos y para expresarlo se colocan los nombres de
los parmetros separados por comas, dentro de los parntesis. Veamos rpidamente la sintaxis para que la
funcin de antes, pero hecha para que reciba dos parmetros, el primero el nombre al que saludar y el

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 68 de 125

 Manual de JavaScript

segundo el color del texto.

function escribirBienvenida(nombre,colorTexto){

document.write("<FONT color='" + colorTexto + "'>")

document.write("<H1>Hola " + nombre + "</H1>")

document.write("</FONT>")

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)

He colocado entre los parntesis dos variables en lugar de dos textos entrecomillados. Cuando colocamos
variables entre los parmetros en realidad lo que estamos pasando a la funcin son los valores que
contienen las variables y no las mismas variables.

Los parmetros se pasan por valor

Al hilo del uso de parmetros en nuestros programas Javascript, tenemos que saber que los parmetros de
las funciones se pasan por valor. Esto quiere decir que estamos pasando valores y no variables. En la
prctica, aunque modifiquemos un parmetro en una funcin, la variable original que habamos pasado no
cambiar su valor. Se puede ver fcilmente con un ejemplo.

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)

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, una vez ejecutada la funcin, 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 con el que habamos
actualizado el parmetro.

En Javascript slo se pueden pasar las variables por valor.

Ahora que hemos aprendido a enviar datos a las funciones, por medio de los parmetros, podemos

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 69 de 125

 Manual de JavaScript

aprender a hacer funciones que devuelven valores.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 02/11/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Valores de retorno
Las funciones pueden devolver valores, a travs de la sentencia return. Tambin vemos un apunte
sobre el mbito de variables en funciones en Javascript.

Estamos aprendiendo acerca del uso de funciones en Javascript y en estos momentos quizs ya nos
hayamos dado cuenta de la gran importancia que tienen para hacer programas ms o menos avanzados. En
este artculo del Manual de Javascript seguiremos aprendiendo cosas sobre funciones y en concreto que con
ellas tambin se puede devolver valores. Adems, veremos algn caso de uso interesante sobre las funciones
que nos puede aclarar un poco el mbito de variables locales y globales.

Devolucin de valores en las funciones

Las funciones en Javascript tambin pueden retornar valores. De hecho, sta es una de las utilidades ms
esenciales de las funciones, que debemos conocer, no slo en Javascript sino en general en cualquier
lenguaje de programacin. De modo que, al invocar una funcin, se podr realizar acciones y ofrecer 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. La entrada de datos en las funciones la
vimos anteriormente en el artculo sobre parmetros de las funciones. Ahora tenemos que aprender acerca
de la salida.

Veamos un 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

Para especificar el valor que retornar la funcin se utiliza la palabra return seguida de el valor que se desea
devolver. En este caso se devuelve el contenido de la variable resultado, que contiene la media calculada de
los dos nmeros.

Quizs nos preguntemos ahora cmo recibir un dato que devuelve una funcin. Realmente en el cdigo
fuente de nuestros programas podemos invocar a las funciones en el lugar que deseemos. Cuando una
funcin devuelve un valor simplemente se sustituye la llamada a la funcin por ese valor que devuelve. As

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 70 de 125

 Manual de JavaScript

pues, para almacenar un valor de devolucin de una funcin, tenemos que asignar la llamada a esa funcin
como contenido en una variable, y eso lo haramos con 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)

Mltiples return

En realidad en Javascript las funciones slo pueden devolver un valor, por lo que en principio no podemos
hacer funciones que devuelvan dos datos distintos.

Nota: en la prctica nada nos impide que una funcin devuelva ms de un valor, pero como slo
podemos devolver una cosa, tendramos que meter todos los valores que queremos devolver en una
estructura de datos, como por ejemplo un array. No obstante, eso sera un uso ms o menos avanzado
que no vamos a ver en estos momentos.

Ahora bien, aunque slo podamos devolver un dato, en una misma funcin podemos colocar ms de un
return. Como decimos, 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 esta funcin podemos ver un ejemplo de utilizacin de 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.

function multipleReturn(numero){

var resto = numero % 2

if (resto == 0)

return 0

else

return numero

Para averiguar si un nmero es par hallamos el resto de la divisin al dividirlo entre 2. Si el resto es cero es
que era par y devolvemos un 0, en caso contrario -el nmero es impar- devolvemos el parmetro recibido.

mbito de las variables en funciones

Dentro de las funciones podemos declarar variables. Sobre este asunto debemos de saber que todas las
variables declaradas en una funcin son locales a esa funcin, es decir, slo tendrn validez durante la
ejecucin de la funcin.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 71 de 125

 Manual de JavaScript

Nota: Incluso, si lo pensamos, nos podremos dar cuenta que los parmetros son como variables que se
declaran en la cabecera de la funcin y que se inicializan al llamar a la funcin. Los parmetros tambin
son locales a la funcin y tendrn validez slo cuando sta se est ejecutando.

Podra darse el caso de que 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.

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.

Veamos el siguiente cdigo.

function variables_glogales_y_locales(){

var variableLocal = 23

variableGlobal = "qwerty"

En este caso variableLocal es una variable que se ha declarado en la funcin, por lo que ser local a la
funcin y slo tendr validez durante su ejecucin. Por otra parte variableGlobal no se ha llegado a declarar
(porque antes de usarla no se ha utilizado la palabra var para declararla). En este caso la variable
variableGlobal es global a toda la pgina y seguir existiendo aunque la funcin finalice su ejecucin.
Adems, si antes de llamar a la funcin existiese la variable variableGlobal, como resultado de la ejecucin
de esta funcin, se machacara un hipottico valor de esa variable y se sustituira por "qwerty".

Nota: Podemos encontrar ms informacin sobre mbito de variables en un artculo anterior.

Con esto hemos terminado el tema de las funciones, as que en adelante nos dedicaremos a otros asuntos
tambin interesantes, como son los Arrays en Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 02/11/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Libreria de funciones Javascript

Javascript, al igual que cualquier otro lenguaje, pone a nuestra disposicin un conjunto de
funciones que llamamos funciones nativas de Javascript.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 72 de 125

 Manual de JavaScript

En todos los lenguajes de programacin existen libreras de funciones que sirven para hacer cosas diversas y
muy repetitivas a la hora de programar. Las libreras de los lenguajes de programacin ahorran la tarea de
escribir las funciones comunes que por lo general pueden necesitar los programadores. Un lenguaje de
programacin bien desarrollado tendr una buena cantidad de ellas. En ocasiones es ms complicado
conocer bien todas las libreras que aprender a programar en el lenguaje.

Javascript contiene una buena cantidad de funciones en sus libreras. Como se trata de un lenguaje que
trabaja con objetos muchas de las libreras se implementan a travs de objetos. Por ejemplo, las funciones
matemticas o las de manejo de strings se implementan mediante los objetos Math y String. Sin embargo,
existen algunas funciones que no estn asociadas a ningn objeto y son las que veremos en este captulo, ya
que todava no conocemos los objetos y no los necesitaremos para estudiarlas.

Funciones incorporadas en Javascript

Estas son las funciones que Javascript pone a disposicin de los programadores.

eval(string)

Esta funcin recibe una cadena de caracteres y la ejecuta como si fuera una sentencia de Javascript.

parseInt(cadena,base)

Recibe una cadena y una base. Devuelve un valor numrico resultante de convertir la cadena en un nmero
en la base indicada.

parseFloat(cadena)

Convierte la cadena en un nmero y lo devuelve.

escape(carcter)

Devuelve un el carcter que recibe por parmetro en una codificacin ISO Latin 1.

unescape(carcter)

Hace exatamente lo opuesto a la funcin escape.

isNaN(nmero)

Devuelve un boleano dependiendo de lo que recibe por parmetro. Si no es un nmero devuelve un true, si
es un numero devuelve false.

Las libreras que se implementan mediante objetos y las del manejo del explorador, que tambin se manejan
con objetos, las veremos ms adelante.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 73 de 125

 Manual de JavaScript

Nota: No queremos llevar a engao a las personas con esta corta lista de funciones nativas de
Javascript. Realmente existen muchas otras funciones que vamos a ver a lo largo del presente manual, lo
que ocurre es que estn asociadas a objetos. Por ejemplo, como habamos sealado, existen funciones de
cadenas de caracteres, que estn asociadas a objetos string, funciones para trabajo con clculos
matemticos avanzados, que estn asociadas a la clase Math, funciones para trabajo con el objeto de la
ventana del navegador, con el documento, etc.

Ejemplos de uso de las funciones incorporadas en Javascript

Hasta el momento hemos conocido simplemente un listado de las funciones nativas del lenguaje Javascript.
Ahora podemos ver varios ejemplos de utilizacin de funciones nativas de Javascript, que tenemos
disponibles en cualquier navegador y en cualquier versin de Javascript.

Veremos tres funciones de diverso mbito que resultan bastante fundamentales en el trabajo habitual con
este lenguaje, explicadas a travs de ejemplos.

Funcin eval

Esta funcin es muy importante, tanto que hay algunas aplicaciones de Javascript que no se podran realizar
si no la utilizamos. Su utilizacin es muy simple, pero puede que resulte un poco ms complejo entender en
qu casos utilizarla porque a veces resulta un poco sutil su aplicacin.

Con los conocimientos actuales no podemos hacer un ejemplo muy complicado, pero por lo menos
podemos ver en marcha la funcin. Vamos a utilizarla en una sentencia un poco rara y bastante inservible,
pero si la conseguimos entender conseguiremos entender tambin la funcin eval.

var miTexto = "3 + 5"

eval("document.write(" + miTexto +")")

Primero creamos una variable con un texto, en la siguiente lnea utilizamos la funcin eval y como
parmetro le pasamos una instruccin javascript para escribir en pantalla. Si concatenamos los strings que
hay dentro de los parntesis de la funcin eval nos queda esto.

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.

Funcin parseInt

Esta funcin recibe un nmero, escrito como una cadena de caracteres, y un nmero que indica una base.
En realidad puede recibir otros tipos de variables, dado que las variables no tienen tipo en Javascript, pero

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 74 de 125

 Manual de JavaScript

se suele utilizar pasndole un string para convertir la variable de texto en un nmero.

Las distintas bases que puede recibir la funcin son 2, 8, 10 y 16. Si no le pasamos ningn valor como base
la funcin interpreta que la base es decimal. El valor que devuelve la funcin siempre tiene base 10, de
modo que si la base no es 10 convierte el nmero a esa base antes de devolverlo.

Veamos una serie de llamadas a la funcin parseInt para ver lo que devuelve y entender un poco ms la
funcin.

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

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

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("desarrolloweb.com"))

Devuelve el numero NaN

Este mismo ejemplo es interesante con una modificacin, pues si le pasamos una combinacin de letras y
nmeros nos dar lo siguiente.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 75 de 125

 Manual de JavaScript

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.

Todos estos ejemplos, un tanto inconexos, sobre cmo trabaja parseInt los revisaremos ms adelante en
ejemplos ms prcticos cuando tratemos el trabajo con formularios.

Funcin isNaN

Esta funcin devuelve un boleano 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. Es una funcin muy sencilla de entender y de utilizar.

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.

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 que lo es devuelve un true.

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.

Referencia: Validar entero en campo de formulario Tenemos un Taller de Javascript muy interesante
que ha sido realizado para afianzar los conocimientos de estos captulos. Se trata de un script para
validar un campo de formulario de manera que sepamos seguro que dentro del campo hay siempre un
nmero entero. Puede ser muy interesante leerlo ahora, ya que utilizamos las funciones isNaN() y
parseInt(). Ver el taller

Esperamos que los ejemplos vistos en este artculo hayan resultado interesantes. No obstante, como

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 76 de 125

 Manual de JavaScript

habamos sealado anteriormente, existen bastantes otras funciones nativas en Javascript que debemos
conocer, pero que estn asociadas a clases y objetos nativos Javascript. Pero antes de pasar a ese punto
queremos ofrecer una pequea gua bsica para el trabajo con programacin orientada a objetos en
Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 11/03/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 77 de 125

 Manual de JavaScript

Arrays Javascript

Los arrays, tambin llamados tablas o matrices, son la primera estructura de datos que podemos aprender en
Javascript y en otros lenguajes de programacin. Sin duda sern imprescindibles para desarrollar programas
medianamente avanzados.

Arrays en Javascript
Vemos que son los arrays en Javascript, para qu sirven y cmo utilizarlos. Veremos diversas
formas de crearlos, as como definir y acceder a sus valores.

Pasamos a un nuevo tema en el Manual de Javascript, en el que vamos a conocer nuestra primera estructura
de datos.

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.

Nota: Los arrays se introdujeron en versiones Javascript 1.1 o superiores, es decir, solo los podemos
utilizar a partir de los navegadores 3.0. Para navegadores antiguos se puede simular el array utilizando
sintaxis de programacin orientada a objetos, pero la verdad es que actualmente esta limitacin no debe
preocuparnos. Adems, dada la complejidad de la tarea de simular un array por medio de objetos, por lo
menos en el momento en que nos encontramos y las pocas ocasiones en que lo necesitaremos,
opinamos que es mejor olvidarnos de ese asunto y trabajar simplemente con los arrays normalmente.
As que en este artculo y los siguientes vamos a ver cmo utilizar el autntico array de Javascript.

Creacin de Arrays javascript

El primer paso para utilizar un array es crearlo. Para ello utilizamos un objeto Javascript ya implementado
en el navegador. Veremos en adelante un tema para explicar lo que es la orientacin a objetos, aunque no
ser necesario para poder entender el uso de los arrays. 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

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 78 de 125

 Manual de JavaScript

tendr ninguna casilla o compartimiento creado. Tambin podemos crear el array Javascript especificando el
nmero de compartimentos que va a tener.

var miArray = new Array(10)

En este caso indicamos que el array va a tener 10 posiciones, es decir, 10 casillas donde guardar datos.

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.

Tanto se indique o no el nmero de casillas del array javascript, 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
nuestros arrays.

miArray[0] = 290

miArray[1] = 97

miArray[2] = 127

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 en Javascript 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. 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>")

Hemos creado un array con tres posiciones, luego hemos introducido un valor en cada una de las posiciones
del array y finalmente las hemos impreso. En general, el recorrido por arrays para imprimir sus posiciones, o
cualquier otra cosa, se hace utilizando bucles. En este caso utilizamos un bucle FOR que va desde el 0 hasta
el 2.

Podemos ver el ejemplo en marcha en otra pgina.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 79 de 125

 Manual de JavaScript

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 carcter.

miArray[0] = "Hola"

miArray[1] = "a"

miArray[2] = "todos"

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, boleanos o cualquier otra cosa que deseemos.

miArray[0] = "desarrolloweb.com"

miArray[1] = 1275

miArray[1] = 0.78

miArray[2] = true

Declaracin e inicializacin resumida de Arrays

En Javascript tenemos a nuestra disposicin una manera resumida de declarar un array y cargar valores en
un mismo paso. Fijmonos en el cdigo siguiente:

var arrayRapido = [12,45,"array inicializado en su declaracin"]

Como se puede ver, se est definiendo una variable llamada arrayRapido y estamos indicando en los
corchetes varios valores separados por comas. Esto es lo mismo que haver declarado el array con la funcin
Array() y luego haberle cargado los valores uno a uno.

En el prximo artculo seguiremos viendo cosas relacionadas con los arrays, en concreto aprenderemos a
acceder a la longitud de un array.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 22/12/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Longitud de los arrays

Aprendemos ms cosas sobre el funcionamiento de los arrays y en concreto vemos como utilizar su
propiedad length para acceder al nmero de casillas que tiene.

En el artculo anterior del Manual de Javascript empezamos a explicar el concepto de array y su utilizacin
en Javascript. En este artculo vamos a continuar con el tema, mostrando el uso de su propiedad length.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 80 de 125

 Manual de JavaScript

Todos los arrays en javascript, aparte de almacenar el valor de cada una de sus casillas, tambin almacenan el
nmero de posiciones que tienen. Para ello utilizan una propiedad del objeto array, la propiedad length. Ya
veremos en objetos qu es una propiedad, pero para nuestro caso podemos imaginarnos que es como una
variable, adicional a las posiciones, que almacena un nmero igual al nmero de casillas que tiene el 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.

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.

Es muy habitual que se utilice la propiedad length para poder recorrer un array por todas sus posiciones.
Para ilustrarlo vamos a ver un ejemplo de recorrido por este array para mostrar sus valores.

for (i=0;i<miArray.length;i++){

document.write(miArray[i])

Hay que fijarse que el bucle for se ejecuta siempre que i valga menos que la longitud del array, extrada de su
propiedad length.

El siguiente ejemplo nos servir para conocer mejor los recorridos por los arrays, el funcionamiento de la
propiedad length y la creacin dinmica de nuevas posiciones. Vamos a crear un array con 2 posiciones y
rellenar su valor. Posteriormente introduciremos un valor en la posicin 5 del array. Finalmente
imprimiremos todas las posiciones del array para ver lo que pasa.

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>")

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 81 de 125

 Manual de JavaScript

El ejemplo es sencillo. Se puede apreciar que hacemos un recorrido por el array desde 0 hasta el nmero de
posiciones del array (indicado por la propiedad length). En el recorrido vamos imprimiendo el nmero de la
posicin seguido del contenido del array en esa posicin. Pero podemos tener una duda al preguntarnos
cul ser el nmero de elementos de este array, ya que lo habamos declarado con 2 y luego le hemos
introducido un tercero en la posicin 5. Al ver la salida del programa podremos contestar nuestras
preguntas. Ser algo parecido a esto:

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

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. Ya veremos ms adelante
qu es este null y dnde lo podemos utilizar, lo importante ahora es que comprendas cmo trabajan los
arrays y los utilices correctamente.

Podemos ver el efecto de este script en tu navegador en una pgina a parte.

Continuaremos el tema de arrays en la siguiente entrega de este manual: Arrays multidimensionales.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 22/12/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

Arrays multidimensionales en Javascript

Vemos qu son los arrays multidimensionales (arrays de ms de una dimensin) y cmo
utilizarlos. Adems explicamos cmo inicializar arrays en su declaracin.

Como estamos viendo, los arrays son bastante importantes en Javascript y tambin en la mayora de los
lenguajes de programacin. En concreto ya hemos aprendido a crear arrays y utilizarlos en artculos
anteriores del Manual de Javascript. Pero aun nos quedan algunas cosas importantes que explicar, como son
los arrays de varias dimensiones.

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.

En Javascript no existe un autntico objeto array-multidimensinal. Para utilizar estas estructuras podremos

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 82 de 125

 Manual de JavaScript

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.

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

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

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

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 bucle que pase 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.

El mtodo para hacer un recorrido dentro de otro es colocar un bucle dentro de otro, lo que se llama un
bucle anidado. 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 as podremos ver cmo construir una
tabla desde Javascript a medida que realizamos el recorrido anidado al bucle.

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>")

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 83 de 125

 Manual de JavaScript

for (j=0;j<temperaturas_cuidades[i].length;j++){

document.write("<td>" + temperaturas_cuidades[i][j] + "</td>")

document.write("</tr>")

document.write("</table>")

Este script resulta un poco ms complejo que los vistos anteriormente. La primera accin consiste en
escribir la cabecera de la tabla, es decir, la etiqueta <TABLE> junto con sus atributos. Con el primer bucle
realizamos un recorrido a la primera dimensin del array y utilizamos la variable i para llevar la cuenta de la
posicin actual. Por cada iteracin de este bucle escribimos una fila y para empezar la fila abrimos la
etiqueta <TR>. Adems, escribimos en una casilla el numero de la ciudad que estamos recorriendo en ese
momento. Posteriormente ponemos otro bucle que va recorriendo cada una de las casillas del array en su
segunda dimensin y escribimos la temperatura de la ciudad actual en cada uno de los meses, dentro de su
etiqueta <TD>. Una vez que acaba el segundo bucle se han impreso las tres temperaturas y por lo tanto la fila
est terminada. El primer bucle contina repitindose hasta que todas las ciudades estn impresas y una vez
terminado cerramos la tabla.

Nota: Habrs podido observar que en ocasiones generar cdigo HTML desde Javascript se hace
complejo. Pero el problema no es solo que el cdigo sea difcil de producir, sino lo peor es que creas un
cdigo difcil de mantener, en el que se mezcla tanto la parte de la programacin en Javascript con la
parte de la presentacin en HTML. Lo que has visto adems es solo un cdigo bien simple, con una
tabla realmente elemental, imagina qu pasara cuando la tabla o los datos fueran ms complejos.
Afortunadamente, hay maneras de generar cdigo HTML de salida mejores que las que hemos visto
ahora, aunque resulta un poco avanzado para el momento en el que estamos. De todos modos, te
dejamos un enlace al manual del sistema de templates Javascript Handlebars, que es una alternativa de
librera sencilla para generar salida en HTML desde Javascript.

Podemos ver el ejemplo en marcha y examinar el cdigo del script entero.

Inicializacin de arrays

Para terminar con el tema de los arrays vamos a ver una manera de inicializar sus valores a la vez que lo
declaramos, as podemos realizar de una manera ms rpida el proceso de introducir valores en cada una de
las posiciones del array.

El mtodo normal de crear un array vimos que era 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 = new Array("Lunes","Martes","Mircoles,","Jueves","Viernes","Sbado","Domingo")

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).

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 84 de 125

 Manual de JavaScript

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.

Javascript todava tiene una manera ms resumida que la que acabamos de ver, que explicamos en el primer
artculo donde tratamos los arrays. Para ello simplemente escribimos entre corchetes los datos del array que
estamos creando. Para acabar vamos a mostrar un ejemplo sobre cmo utilizar esta sintaxis para declarar
arrays de ms de una dimensin.

var arrayMuchasDimensiones = [1, ["hola", "que", "tal", ["estas", "estamos", "estoy"], ["bien", "mal"], "acabo"], 2, 5];

En este ejemplo hemos creado un array muy poco uniforme, porque tiene casillas con contenido de simples
enteros y otras con contenido de cadena y otras que son otros arrays. Podramos acceder a algunas de sus
casillas y mostrar sus valores de esta manera:

alert (arrayMuchasDimensiones[0])

alert (arrayMuchasDimensiones[1][2])

alert (arrayMuchasDimensiones[1][3][1])

Con esto hemos llegado al fin de los artculos que tratan sobre arrays en Javascript y ahora podemos
continuar con una pequea pausa y consejos que vendrn bien para mejorar nuestra relacin con este
lenguaje de programacin.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 22/12/2001
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 85 de 125

 Manual de JavaScript

Objetos en Javascript

En los siguientes artculos vamos a abordar el mundo de los objetos en Javascript. Sern esenciales para
cualquier persona que est comenzando en la programacin en general, ya que se tratarn conceptos muy
recurrentes en cualquier lenguaje. Adems trataremos con detalle las particularidades de los objetos en el
lenguaje Javascript, ya que son bastante distintas en relacin a otros lenguajes ms tradicionales.

Introduccin general a los objetos en Javascript

Breve introduccin al mundo de los objetos, en programacin en general, y a las particularidades
del uso de objetos en el lenguaje Javascript.

Vamos a introducirnos en un tema muy importante de Javascript como son los objetos. Es un tema que aun
no hemos visto y sobre el que en adelante vamos a tratar constantemente pues la mayora de las cosas en
Javascript, incluso las ms sencillas, las vamos a realizar a travs del manejo de objetos. De hecho, en los
ejemplos realizados hasta ahora hemos hecho grandes esfuerzos para no utilizar objetos y aun as los hemos
utilizado en alguna ocasin, pues es muy difcil encontrar ejemplos en Javascript que, aunque sean simples,
no hagan uso de ellos.

La programacin orientada a objetos (POO) representa una nueva manera de pensar a la hora de hacer un
programa. Javascript no es un lenguaje de programacin orientado a objetos puro porque, aunque utiliza
objetos en muchas ocasiones, no necesitamos programar todos nuestros programas en base a ellos. De
hecho, lo que vamos a hacer generalmente con Javascript es usar objetos y no tanto programar orientado a
objetos. Por ello, la manera de programar no va a cambiar mucho con respecto a lo que hemos visto hasta
ahora en el Manual de Javascript. En resumen, lo que hemos visto hasta aqu relativo a sintaxis, funciones,
etc. sigue siendo perfectamente vlido y puede ser utilizado igual que se ha indicado. Solo vamos a aprender
una especie de estructura nueva como son los objetos.

Nota: Para empezar a empaparnos un poco sobre los objetos tenemos un pequeo artculo publicado
en DesarrolloWeb sobre la programacin orientada a objetos. Sera muy recomendable que lo leyeras,
porque se explican varios conceptos en los cuales no vamos a entrar con tanto detalle. Si conoces ya la
POO contina leyendo sin pausa, pero si deseas profundizar recuerda que tenemos tambin un Manual
completo de Orientacin a objetos. Si te gusta ver vdeos te recomendamos tambin la clase Qu son
los objetos impartida en el Curso de Programacin en vdeo.

Qu es un objeto

Aunque no vamos a entrar en detalle con los concetos, pues se encuentran muy bien explicados en
referencias que ya hemos indicado, los objetos son una herramienta de lenguajes de programacin en la que
se unen dos cosas fundamentales: los datos y la funcionalidad. Todo programa informtico trata
bsicamente esas dos cosas de alguna manera. Con lo que hemos visto hasta ahora los datos los tenamos en

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 86 de 125

 Manual de JavaScript

variables y la funcionalidad en funciones no es as? pues en el mundo de los objetos, tanto datos como
funcionalidad estn en la misma estructura, el objeto.

El asunto es que ahora necesitas aprender nuevos nombres con los que referirte a los datos y funcionalidad
agrupados en un objeto:

Propiedades: En los objetos las propiedades se refieren a los datos

Mtodos: En objetos, los mtodos se refieren a la funcionalidad

Imagina que tienes un objeto botn (un botn del navegador, algo que puedes pulsar para realizar una
accin). El botn tiene un texto escrito, pues ese texto sera un dato y por lo tanto le llamaramos
propiedad. Otra propiedad de un botn sera si est o no activado. Por otra parte, un botn podra tener
funcionalidad asociada, que estara en un mtodo, como procesar la accin de un clic. Imagina algo ms
genrico como un telfono. El telfono puede tener propiedades como la marca, modelo, sistema operativo
y mtodos como encender, apagar, llamar a un nmero, etc.

En lenguajes de programacin orientados a objetos puros, como puede ser Java, tienes que programar
siempre en base a objetos. Para programar tendras que crear "clases", que son una especie de "moldes" a
partir de los cuales se crean objetos. El programa resolvera cualquier necesidad mediante la creacin de
objetos en base a esos moldes (clases), existiendo varios (decenas, cientos o miles) de objetos de diversas
clases. Los objetos tendran que colaborar entre si para resolver cualquier tipo de accin, igual que en
sistemas como un avin existen diversos objetos (el motor, hlices, mandos...) que colaboran entre s para
resolver la necesidad de llevar pasajeros o mercanca en viajes areos.

Sin embargo, como venamos diciendo, en Javascript no es tanto programar orientado a objetos, sino usar
objetos. Muchas veces sern objetos ya creados por el propio navegador (la ventana del navegador, un
documento HTML que se est visualizando, una imagen o un formulario dentro de ese documento HTML,
etc), y otras veces sern objetos creados por ti mismo o por otros desarrolladores que te sirven para hacer
cosas especficas. Por tanto, lo que nos interesa saber para comenzar es la sintaxis que necesitas para usar
los objetos, bsicamente acceder a sus propiedades y ejecutar sus mtodos.

Nota: Para conocer cules son los objetos del navegador, que tenemos a disposicin en Javascript para
resolver las necesidades de las pginas web, tienes que leer el manual sobre trabajo con Javascript para
uso y manipulacin de los recursos del navegador.

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

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 87 de 125

 Manual de JavaScript

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()

Cmo crear objetos

Como hemos dicho, la mayora de los objetos con los que vas a trabajar en Javascript para poder crear
interaccin, efectos y comportamientos diversos en pginas web, te los dan ya hechos. El propio navegador
te los ofrece para que t simplemente los tengas que usar. Eso es material de estudio del Manual de
Javascript y los objetos del navegador. Aclarado ese punto hay que advertir que Javascript es un tanto
particular a la hora de crear objetos, bsicamente porque tradicionalmente no existe el conceto de "clase".

Para ser ms exactos, en Javascript, ES5, las clases se crean por medio de funciones y con el operador new
creas objetos a partir de esas funciones, pero no existen las clases como las que conocemos en otros
lenguajes ms tradicionales.

Nota: Ahora en ES6 ya existen las clases y Javascript es capaz de generar clases y a partir de ellas
producir objetos, como otros lenguajes. Obtienes ms informacin en el Manual de ES6.

La otra alternativa para crear objetos en Javascript es por medio de literales de objeto, que no son ms que
la definicin del objeto por medio de cdigo encerrado entre llaves, indicando sus propiedades o mtodos
tal cual.

nombre: 'Miguel Angel Alvarez',

sitioWeb: 'DesarrolloWeb.com'

En el cdigo anterior solo hemos definido propiedades, pero tenemos otros artculos donde podrs ver
cmo definir mtodos tambin. Para saber ms sobre los literales de objetos te recomendamos la lectura del
artculo sobre Literales de objetos Javascript, donde vamos a explicarte ms detenidamente esta sintaxis
habitual de creacin de objetos en este lenguaje.

En Javascript tradicional hemos dicho que no existen las clases, pero podremos crear instancias de objetos a
partir de funciones, como veremos en el siguiente punto.

Crear e instanciar objetos a partir de funciones

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 88 de 125

 Manual de JavaScript

Para quien no lo sepa, instanciar un objeto es la accin de crear un ejemplar de una clase, para poder
trabajar con l luego. La clase es la definicin de las caractersticas y funcionalidades de un objeto. Con las
clases no se trabaja directamente, stas slo son definiciones. Para trabajar con una clase debemos tener un
objeto instanciado de esa clase. Recordamos que en Javascript no existen clases, pero podemos usar
funciones.

Esta simple funcin podramos usarla como molde para construir objetos de la clase Persona:

function Persona(nombre) {

this.nombre = nombre;

Observars que estamos usando dentro la palabra "this". Esa palabra es una referencia al objeto que se va a
crear con esta funcin. En javascript para crear un objeto a partir de una funcin se utiliza la instruccin
new, de esta manera.

var miguel = new Persona('Miguel Angel Alvarez');

En una variable que llamamos "miguel" asigno un nuevo (new) ejemplar de la clase Persona. Los parntesis
se rellenan con los datos que necesite la clase para inicializar el objeto, si no hay que meter ningn
parmetro los parntesis se colocan vacos. En realidad lo que se hace cuando se crea un objeto es llamar a
la funcin que lo construye y la propia funcin se encargar de inicializar las propiedades del objeto (para lo
que usa la referencia "this").

Ciertamente, si los conceptos de programacin orientada a objetos son nuevos para ti, quizs muchos
puntos de este artculo se quedarn un poco complejos. No queremos que te asustes, puesto que
volveremos sobre todo esto en futuros artculos y lo podrs ir entendiendo mejor. En concreto, esta parte
de la creacin de objetos a partir de funciones est explicada en el artculo Creacin de clases en Javascript
con ES5. Recuerda tambin aclarar tus dudas ms tericas sobre clases y objetos en el Manual de la teoria
de la programacin orientada a objetos.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 19/12/2016
Disponible online en http://desarrolloweb.com/articulos/introduccion-objetos-javascript.html

Literales de objeto en Javascript

Cmo podemos crear objetos en Javascript a partir de un literal, operaciones tpicas que puedes
realizar con esos objetos.

Voy a comenzar una serie de artculos que me sirven como apuntes de programacin orientada a objetos en
Javascript. Este lenguaje es bastante particular en este sentido y en ocasiones te permite hacer cosas que en
otros lenguajes seran impensables. Tambin al contrario, algunas cosas bsicas de lenguajes tradicionales en
Programacin Orientada a Objetos no existen en Javascript.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 89 de 125

 Manual de JavaScript

Javascript no tiene clases como tal, por lo menos hasta que llegue la nueva actualizacin Ecma6 prevista
para 2015, pero s que tiene objetos. Adems tiene algo que no todos los lenguajes poseen, un mecanismo
para la creacin de objetos a partir de lo que conocemos como "literal".

Nota: Para los que no conozcan el trmino "literal", cabe decir que es una palabra que indica algo
escrito de manera "literal". Aunque sea muy feo usar la misma palabra para definir algo, me lo vas a
permitir porque es la mejor que existe. Un literal es algo extremadamente sencillo de entender con un
ejemplo.

var x = "hola";

En esa lnea de cdigo "hola" es un literal. En concreto decimos que es un "literal de cadena". Ahora
mira esta otra lnea:

y +=5;

Cuando ves un nmero escrito tal cual en tu cdigo decimos que es un literal numrico.

Podemos crear un objeto en Javascript asignando un valor literal de objeto en una variable. Eso se consigue
colocando dicho literal entre llaves y dentro de ellas tantas propiedades o mtodos con pares "clave/valor",
por medio de una sintaxis como esta:

var dimensiones = {

altura: 34,

anchura: 455

Como ests viendo, tenemos una variable dimensiones. Al asignarle un literal objeto estamos realmente
asignando una referencia a un objeto en la memoria creado con las propiedades que acabamos de asignar.

Las propiedades se separan por comas y se coloca siempre el nombre de la propiedad, el caracter ":" y luego
el valor de la propiedad.

Por supuesto, tambin podremos asignar mtodos a nuestros objetos literales.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 90 de 125

 Manual de JavaScript

var dimensiones = {

altura: 34,

anchura: 455,

area: function(){

return this.altura * this.anchura;

Como ves, los mtodos en Javascript simplemente son propiedades a los que les asignas una funcin.
Dentro del cdigo de tus mtodos puedes acceder a las propiedades del objeto a travs de la variable this.

Una vez creado ese objeto, puedes usar la notacin punto para acceder a sus propiedades (o mtodos).

dimensiones.altura = 90 //accede a la propiedad altura y le asigna el valor 90

Nota: Los literales de objeto no son la nica manera de crear objetos en Javascript. Adems existe un
manera de definir algo parecido a una clase, pero no es exactamente lo que conocemos en la
programacin orientada a objetos tradicional y no podramos llegar a considerarla tal. En lugar de ello
podemos crear funciones que, al invocarlas con la palabra "new" te crean nuevos objetos inicializados
con esa funcin. Tcnicamente, en vez de definir clases, en Javascript definimos funciones constructoras
de objetos. En definitiva, una implementacin muy particular que a veces nos puede liar si estamos
familiarizados con lenguajes de enfoque ms tradicional (en lo que respecta a OOP "Object Oriented
Programing") como Java o PHP. Esta es una discusin interesante, que podras complementar con el
artculo dedicado a crear clases en Javascript, pero que no es la que nos ocupa en esta ocasin.

Esto no es JSON?

El formato de intercambio de datos JSON se ha popularizado mucho y quizs lo conozcas antes de conocer
estos detalles sobre los literales de objeto Javascript. En ese caso puede que te hayas dado cuenta que los
literales de objeto Javascript no son ms que estructuras JSON. Si es as permteme apuntar que realmente
tendramos que darle la vuelta a esa frase y decir que la notacin JSON utiliza la sintaxis de los literales de
objeto Javascript como formato.

As pues, lo que conozcas de JSON lo puedes aplicar al mundo de Javascript inmediatamente. De hecho, si
has tenido ocasin de trabajar con este formato desde Javascript, habrs comprobado que en la mayora de
los casos puedes volcar un objeto JSON en una variable Javascript e inmediatamente trabajar con l como si
fuera un objeto que tienes en la memoria.

Nota: Puedes saber ms de JSON en el artculo Qu es JSON.

Crear nuevas propiedades y mtodos sobre objetos creados

Javascript es muy permisivo y nos deja hacer cosas que produciran errores en otros lenguajes. Es el caso de

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 91 de 125

 Manual de JavaScript

la asignacin de valores a propiedades que no han sido creadas previamente.

Tengo mi objeto coche:

var coche = {

color: "rojo",

marca: "Opel"

Ahora podra crear nuevas propiedades en ese objeto asignando valores a las propiedades que no existan
previamente.

coche.anoFabricacion = 2014;

Los mtodos los creas asignando funciones:

coche.arrancar = function(){

alert("rum rum");

Los mtodos y funciones que acabamos de crear son tan vlidos como los que ya estuvieran en mi objeto
cuando fue definido por medio de su literal. Podr acceder a sus elementos con la notacin punto, que ya
conoces.

console.log(coche.color);

console.log(coche.anoFabricacion);

coche.arrancar();

Ejemplo para practicar con literales de objeto

En el siguiente cdigo ponemos en marcha los nuevos conocimientos que has adquirido sobre literales de
objeto en Javascript.

var miObjeto = {

propiedad1: "Algo",

propiedad2: "Otra cosa",

propiedad3: true,

propiedad4: 344,

metodo1: function(){

alert("Ejecutaste metodo1");

},

metodo2: funcionMetodo2

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 92 de 125

 Manual de JavaScript

function funcionMetodo2(){

//puedo usar la variable this para acceder a mis propias propiedades o mtodos

this.propiedad2 = "Esto lo he modificado desde el mtodo metodo2";

//Veamos el valor de esas propiedades

console.log(miObjeto.propiedad1);

console.log(miObjeto.propiedad2);

//ejecutemos algn mtodo

miObjeto.metodo1();

miObjeto.metodo2();

//creamos nuevas propiedades

miObjeto.otraPropiedad = "Esto est creado a posteriori";

//creamos nuevos mtodos

miObjeto.otroMetodo = function(){

console.log("ejecutaste otro mtodo");

//veamos el contenido de todo el objeto

console.log(miObjeto);

Eso es todo por el momento, espero que te hayamos aclarado algo.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 31/10/2014
Disponible online en http://desarrolloweb.com/articulos/literales-objeto-javascript.html

for in en Javascript
Recorridos for in a propiedades de objetos en Javascript. Cmo iterar por las propiedades y los
valores de las propiedades de un objeto, de manera genrica en Javascript con el bucle for ... in.

En Javascript no existen arrays asociativos y como sabes, stos son siempre buenos aliados como recursos
para la programacin. Si queremos usar algo parecido a un array asociativo tendremos que utilizar las
construcciones de objetos. De todos modos, con lo que nos ofrece el lenguaje somos capaces de realizar
todas las cosas que en otros lenguajes haces con los arrays asociativos.

En este artculo pretendemos explicarte cmo realizar un recorrido genrico a todas las propiedades
presentes en un objeto, junto con sus valores. Ese recorrido es "genrico", es decir, es independiente del
nmero de propiedades que se encuentre en el objeto que estamos recorriendo y es independiente tambin
de sus nombres de propiedad o sus valores.

Nota: Por si no lo sabes, los arrays asociativos son aquellos que no tienen ndices numricos sino
alfabticos. Nos sirven para muchas cosas en los lenguajes de programacin. Si no lo sabas, ya te dars

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 93 de 125

 Manual de JavaScript

cuenta. De momento entonces olvida la mencin a los arrays asociativos y piensa solo en objetos y sus
propiedades.

Bucle for ... in

En Javascript hay una construccin especial del bucle for de toda la vida, que te permite recorrer todas las
propiedades de un objeto. Es parecido a lo que en otros lenguajes tenemos en el bucle foreach (Javascript
tambin tiene el forEach pero es solo para arrays y no es un bucle sino un mtodo de arrays, que sirve para
iterar, pero no es una estructura de control como tal). Su sintaxis es la siguiente:

for (propiedad in objeto){

//cdigo a repetir por el bucle.

//dentro de este cdigo la variable "propiedad" contiene la propiedad actual

//actual en cada uno de los pasos de la iteracin.

No hay mucho ms que explicar sobre esta estructura del bucle for-in, solo decir que de esta manera tal cual
puedes acceder a los nombres de las propiedades del objeto. Gracias al bucle, el cdigo que se incluye
dentro del for se ejecutar una vez por cada una de las propiedades del objeto.

Habrs notado que hemos dicho que as podrs acceder a las propiedades. No te preocupes que para
acceder a sus valores tendrs que usar un truquillo. Lo veremos tambin en este artculo, pero no nos
adelantemos.

Bucle para acceder a las propiedades de un objeto

Veamos una aplicacin de este bucle for in con un ejemplo sencillo que nos arroje algo de luz.

Tenemos un objeto creado a partir de un literal de objeto.

var diasMes = {

enero: 31,

febrero: 28,

marzo: 31,

abril: 30,

mayo: 31

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 94 de 125

 Manual de JavaScript

Son los meses del ao y los das que tiene ese mes. Es verdad que febrero puede tener otros das y que me
faltan meses, pero a fines didcticos es suficiente. Observars que esta estructura en resumen es muy
parecida a lo que sera un array asociativo. Si los necesitamos en nuestro programa la podemos usar como si
lo fuera.

Nota: Si no entiendes la definicin de un objeto por medio de un literal, simplemente lee el artculo
sobre literales de objeto.

Pues para acceder a las propiedades de ese objeto (en este caso sera para acceder a los nombres de cada
uno de los meses) usaras este bucle.

for (var mes in diasMes){

console.log(mes);

Con esto conseguirs en la consola que aparezcan todos los nombres de los meses del ao que tenemos en
ese objeto diasMes.

Bucle para acceder a los valores de las propiedades

Una situacin comn es que no quieras acceder a los nombres de las propiedades, sino a los valores. Para
ello podemos usar un pequeo truco que nos permite Javascript. Se trata de que podemos acceder a las
propiedades de los objetos como si fueran arrays, indicando como ndice del array una cadena con el
nombre de la propiedad.

alert(diasMes["mayo"]);

Eso nos mostrar en una caja de alerta el valor 31 que es el que est asociado a la propiedad "mayo" del
objeto "diasMes".

Te habrs dado cuenta que esta sintaxis para acceder a los valores de las propiedades es justamente igual a la
sintaxis que se usa para acceder a valores de casillas de un array asociativo.

Bueno, pues sabiendo esto podrs acceder a los valores del objeto, uno por uno, con un bucle for ... in muy
parecido al que tenamos antes.

for (var mes in diasMes){

console.log(diasMes[mes]);

Seguro que ahora te parece sencillo. Es que realmente lo es.

Todo junto, acceso a la propiedad y su valor

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 95 de 125

 Manual de JavaScript

Esta parte ya seguro que ni te hace falta leerla. Simplemente quiero mostrar un mensaje en la consola ms
legible, accediendo en el mismo bucle a la propiedad y su valor.

for (var mes in diasMes){

console.log("El mes " + mes + " tiene " + diasMes[mes] + " dias.");

Eso es todo, con estos conocimientos ya no se te pueden escapar las posibilidades de recorridos a objetos y
la construccin del til bucle for-in. Adems, si necesitas arrays asociativos para construir tus programas
sabrs la manera alternativa de implementarlos y usarlos, por medio de objetos, en Javascript. Seguro que te
servir de ayuda, incluso aunque ahora no sepas para qu.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 19/11/2014
Disponible online en http://desarrolloweb.com/articulos/recorridos-propiedades-objetos-javascript-forin.html

Creacin de clases en Javascript tradicional

Ahora que ya sabemos lo que son los objetos, vamos a ver cmo podemos crear y usar nuestros
propios objetos en Javascript tradicional, ES5, abordando diversos ejemplos prcticos.

En captulos anteriores de esta segunda parte del Manual de Javascript vimos las generalidades sobre la
programacin orientada a objetos. Adems, estuvimos dando un repaso bastante completo a los distintos
objetos nativos de Javascript.

Ahora que ya hemos conocido un poco los objetos y hemos aprendido a manejarlos podemos pasar a un
tema ms avanzado, como es el de construir nuestros propios objetos, que puede sernos til en ciertas
ocasiones para temas avanzados.

As que vamos a ver cmo podemos definir nuestros propios objetos, con sus propiedades y mtodos, de
manera que aprendamos el mecanismo, pero sin entrar demasiado en aspectos prcticos que los dejamos
para ejemplos del futuro.

Para crear nuestros propios objetos debemos crear una clase, que recordamos que es algo as como la
definicin de un objeto con sus propiedades y mtodos. Para crear la 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){

//Inicializo las propiedades y mtodos

this.miPropiedad = valor_inicializacion

this.miMetodo = nombre_de_una_funcion_definida

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 96 de 125

 Manual de JavaScript

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

Lo veremos todo ms detenidamente si hacemos un ejemplo. En este ejemplo vamos a crear un objeto
estudiante universitario. Como estudiante tendr unas caractersticas como el nombre, la edad o 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.

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 null a la propiedad numMatrcula.

Escribir mtodos

Ahora vamos a continuar con esa definicin de la clase para incorporar mtodos.

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. Pues debemos recordar que para llamar a un mtodo debemos tener un objeto y
this hace referencia a ese objeto.

function matriculate(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.

Vamos a construir otro mtodo que imprime los datos del alumno.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 97 de 125

 Manual de JavaScript

function imprimete(){

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.

Constructor: Colocamos mtodos

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.matriculate = matriculate

this.imprimete = imprimete

Vemos que en las ltimas lneas asignamos a los mtodos los nombres de las funciones que contienen su
cdigo.

Para instanciar un objeto

Para instanciar objetos de la clase AlumnoUniversitario utilizamos la sentencia new, que ya hemos tenido
ocasin de ver en otras ocasiones.

miAlumno = new AlumnoUniversitario("Jos Daz",23)

Trabajando con la clase, creando instancias y usando objetos

Para ilustrar el trabajo con objetos y terminar con el ejemplo del AlunnoUniversitario, vamos a ver todo
este proceso en un solo script en el que definiremos la clase y luego la utilizaremos un poquito.

//definimos el mtodo matricularte para la clase AlumnoUniversitario

function matriculate(num_matricula){

this.numMatricula = num_matricula

//definimos el mtodo imprimete para la clase AlumnoUniversitario

function imprimete(){

document.write("<br>Nombre: " + this.nombre)

document.write("<br>Edad: " + this.edad)

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 98 de 125

 Manual de JavaScript

document.write("<br>Nmero de matrcula: " + this.numMatricula)

//definimos el constructor para la clase

function AlumnoUniversitario(nombre, edad){

this.nombre = nombre

this.edad = edad

this.numMatricula = null

this.matriculate = matriculate

this.imprimete = imprimete

//creamos un alumno

miAlumno = new AlumnoUniversitario("Jos Daz",23)

//le pedimos que se imprima

miAlumno.imprimete()

//le pedimos que se matricule

miAlumno.matriculate(305)

//le pedimos que se imprima de nuevo (con el nmero de matricula relleno)

miAlumno.imprimete()

Si lo deseamos, podemos ver el script en funcionamiento en una pgina a parte.

No vamos a hablar ms por el momento sobre cmo crear y utilizar nuestros propios objetos, pero en el
futuro trataremos este tema con ms profundidad y haremos algn ejemplo adicional.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 21/05/2002
Disponible online en http://desarrolloweb.com/articulos/clases-javascript-es5.html

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 99 de 125

 Manual de JavaScript

Libreras de clases y objetos en

Javascript

En Javascript, como en cualquier lenguaje, existen muchas funcionalidades bsicas ya desarrolladas para el
resolver necesidades habituales en los programas, como clculos matemticos, o control de fechas. En los
siguientes artculos podrs conocer cmo esas libreras estn disponibles en Javascript por medio de
diversas clases y objetos de utilidad general. Aprenderemos y practicaremos con diversos recursos del
lenguaje para realizar todo tipo de operaciones matemticas avanzadas, trabajo con cadenas de caracteres,
trabajo con fechas, tipos primitivos, etc.

Objetos incorporados en Javascript

Lista de los objetos que tenemos a nuestra disposicin a la hora de trabajar con Javascript.

Llegamos a un punto interesante dentro de la segunda parte del Manual de programacin en Javascript. En
estos momentos sabemos ya lo que es la programacin orientada a objetos, as que vamos a introducirnos
en el manejo de objetos en Javascript y para ello vamos a empezar con el estudio de las clases predefinidas
que implementan las libreras para el trabajo con strings, matemticas, fechas etc.

Las clases que se encuentran disponibles de manera nativa en Javascript, y que vamos a ver a continuacin,
son las siguientes:

String, para el trabajo con cadenas de caracteres.

Date, para el trabajo con fechas.
Math, para realizar funciones matemticas.
Number, para realizar algunas cosas con nmeros
Boolean, trabajo con boleanos.

Nota: Las clases se escriben con la primera letra en maysculas. Tiene que quedar claro que una
clase es una especie de "declaracin de caractersticas y funcionalidades" de los objetos. Dicho de otro
modo, las clases son descripciones de la forma y funcionamiento de los objetos. Con las clases
generalmente no se realiza ningn trabajo, sino que se hace con los objetos, que creamos a partir de las
clases.

Una vez comprendida la diferencia entre objetos y clases, cabe sealar que String es una clase, lo mismo
que Date. Si queremos trabajar con cadenas de caracteres o fechas necesitamos crear objetos de las
clases String y Date respectivamente. Como sabemos, Javascript es un lenguaje sensible a las maysculas
y las minsculas y en este caso, las clases, por convencin, siempre se escriben con la primera letra
en mayscula y tambin la primera letra de las siguientes palabras, si es que el nombre de la clase
est compuesto de varias palabras. Por ejemplo si tuvieramos la clase de "Alumnos universitarios" se
escribira con la -A- de alumnos y la -U- de universitarios en mayscula. AlumnosUniversitarios sera el
nombre de nuestra supuesta clase.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 100 de 125

 Manual de JavaScript

Hay otros que pertenecen a este mismo conjunto, los enumeramos aqu para que quede constancia de ellos,
pero no los vamos a tocar en captulos siguientes.

Array, ya los hemos visto en captulos correspondientes al primer manual de Javascript.

Tambin la clase Function, lo hemos visto parcialmente al estudiar las funciones.
Hay otra clase RegExp que sirve para construir patrones que veremos tal vez junto con Function
cuando tratemos temas ms avanzados todava.

Nota: Uso de maysculas y minsculas. Ya que nos hemos parado anteriormente a hablar sobre el
uso de maysculas en ciertas letras de los nombre de las clases, vamos a terminar de explicar la
convencin que se lleva a cabo en Javascript para nombrar a los elementos.

Para empezar, cualquier variable se suele escribir en minsculas, aunque si este nombre de variable se
compone de varias palabras, se suele escribir en mayscula la primera letra de las siguientes palabras a la
primera. Esto se hace as en cualquier tipo de variable o nombre menos en los nombres de las clases,
donde se escribe tambin en mayscula el primer caracter de la primera palabra.

Ejemplos:

Number, que es una clase se escribe con la primera en mayscula. RegExp, que es el nombre de otra
clase compuesto por dos palabras, tiene la primera letras de las dos palabras en mayscula. miCadena,
que supongamos que es un objeto de la clase String, se escribe con la primera letra en minscula y la
primera letra de la segunda palabra en mayscula. fecha, que supongamos que es un objeto de la clase
Date, se escribe en minsculas por ser un objeto. miFuncin(), que es una funcin definida por
nosotros, se acostumbra a escribir con minscula la primera.

Como decimos, esta es la norma general para dar nombres a las variables, clases, objetos, funciones, etc.
en Javascript. Si la seguimos as, no tendremos problemas a la hora de saber si un nombre en Javascript
tiene o no alguna mayscula y adems todo nuestro trabajo ser ms claro y fcil de seguir por otros
programadores o nosotros mismos en caso de retomar un cdigo una vez pasado un tiempo.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 21/03/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

Tratamiento de String en Javascript

Las cadenas en Javascript son objetos de la clase String, que contienen diversos mtodos que nos
sirven para manejar cadenas de caracteres. Estudiamos sus propiedades y la lista completa de
mtodos.

En javascript las variables de tipo texto son objetos de la clase String. Esto quiere decir que cada una de las
variables que creamos de tipo texto tienen una serie de propiedades y mtodos. Recordamos que las
propiedades son las caractersticas, como por ejemplo longitud en caracteres del string y los mtodos son
funcionalidades, como pueden ser extraer un substring o poner el texto en maysculas.

Para crear un objeto de la clase String lo nico que hay que hacer es asignar un texto a una variable. El texto
va entre comillas, como ya hemos visto en los captulos de sintaxis. Tambin se puede crear un objeto string
con el operador new, que veremos ms adelante. La nica diferencia es que en versiones de Javascript 1.0
no funcionar new para crear los Strings.

Propiedades de String

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 101 de 125

 Manual de JavaScript

Length

La clase String slo tiene una propiedad: length, que 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.

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 exctamente 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.

replace(substring_a_buscar,nuevoStr)

Implementado en Javascript 1.2, 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)

Este mtodo slo es compatible con javascript 1.1 en adelante. 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.

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.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 102 de 125

 Manual de JavaScript

toLowerCase()

Pone todas los caracteres de un string en minsculas.

toUpperCase()

Pone todas los caracteres de un string en maysculas.

toString()

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

Hasta aqu hemos visto los mtodos que nos ayudarn a tratar cadenas. Ahora vamos a ver otros mtodos
que son menos tiles, pero hay que indicarlos para que quede constancia de ellos. Todos sirven para aplicar
estilos a un texto y es como si utilizsemos etiquetas HTML. Veamos cmo.

anchor(name)

Convierte en un ancla (sitio a donde dirigir un enlace) una cadena de caracteres usando como el atributo
name de la etiqueta <A> lo que recibe por parmetro.

big()

Aumenta el tamao de letra del string. Es como si colocsemos en un string al principio la etiqueta <BIG> y
al final </BIG>.

blink()

Para que parpadee el texto del string, es como utilizar la etiqueta <BLINK>. Solo vale para Netscape.

bold()

Como si utilizsemos la etiqueta <B>.

fixed()

Para utilizar una fuente monoespaciada, etiqueta <TT>.

fontColor(color)

Pone la fuente a ese color. Como utilizar la etiqueta <FONT color=el_color_indicado>.

fontSize(tamao)

Pone la fuente al tamao indicado. Como si utilizsemos la etiqueta <FONT> con el atributo size.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 103 de 125

 Manual de JavaScript

italics()

Pone la fuente en cursiva. Etiqueta <I>.

link(url)

Pone el texto como un enlace a la URL indicada. Es como si utilizsemos la etiqueta <A> con el atributo
href indicado como parmetro.

small()

Es como utilizar la etiqueta <SMALL>

strike()

Como utilizar la etiqueta <STRIKE>, que sirve para que el texto aparezca tachado.

sub()

Actualiza el texto como si se estuviera utilizando la etiqueta <SUB>, de subndice.

sup()

Como si utilizsemos la etiqueta <SUP>, de superndice.

Ejemplos de funcionamiento de los objetos de clase String

Hasta ahora hemos visto muchos mtodos interesantes de elementos de tipo String, pero no estar de ms
pasar a la prctica para entender todo mucho mejor. As pues, veamos unos ejemplos sobre cmo se utilizan
los mtodos y propiedades del objeto String.

Ejemplo de strings 1

Vamos a escribir el contenido de un string con un carcter 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)

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 104 de 125

 Manual de JavaScript

Primero creamos dos variables, una con el string a recorrer y otra con un string vaco, donde guardaremos
el resultado. Luego hacemos un bucle que recorre desde el primer hasta el penltimo carcter del string -
utilzamos la propiedad length para conocer el nmero de caracteres del string- y en cada iteracin
colocamos un carcter del string seguido de un carcter separador "-". Como aun nos queda el ltimo
carcter por colocar lo ponemos en la siguiente lnea despus del bucle. Utilizamos la funcin charAt para
acceder a las posiciones del string. Finalmente imprimimos en la pgina el resultado.

Podemos ver el ejemplo en funcionamiento en una pgina a parte.

Ejemplo de strings 2

Vamos a hacer un script que rompa 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)

Las dos primeras lneas sirven para declarar las variables que vamos a utilizar e inicializar el string a partir.
En la siguiente lnea hallamos la posicin de la mitad del string.

En las dos siguientes lneas es donde realizamos el trabajo de poner en una variable la primera mitad del
string y en la otra la segunda. Para ello utilizamos el mtodo substring pasndole como inicio y fin en el
primer caso desde 0 hasta la mitad y en el segundo desde la mitad hasta el final. Para finalizar imprimimos
las dos mitades con un salto de lnea entre ellas.

Podemos ver el ejemplo en funcionamiento en una pgina a parte.

Una vez sabemos manejar los objetos de la clase string, podemos pasar a ver otras de las clases nativas de
Javascript, como la clase Date.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 21/03/2002
Disponible online en http://desarrolloweb.com/articulos/objetos-string-javascript.html

Clase Date en Javascript

Explicamos la clase Date de Javascript, que se utiliza para el manejo de fechas y horas.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 105 de 125

 Manual de JavaScript

Exploramos sus diversos mtodos y propiedades de los objetos Date, con los que realizar clculos
en el tiempo.

Vamos a empezar a relatar todas las cosas que debes saber sobre otro de los objetos nativos de Javascript, el
que implementa la clase Date.

Sobre la clase Date recae todo el trabajo con fechas en Javascript, como obtener una fecha, el da la hora
actuales 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.

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.

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.

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.

getMinutes()

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 106 de 125

 Manual de JavaScript

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.

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.

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).

setSeconds()

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 107 de 125

 Manual de JavaScript

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.

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.

Como habris podido apreciar, hay algn mtodo obsoleto por cuestiones relativas al ao 2000: setYear() y
getYear(). Estos mtodos se comportan bien en Internet Explorer y no nos dar ningn problema el
utilizarlos. Sin embrago, no funcionarn correctamente en Netscape, por lo que es interesante que
utilicemos en su lugar los mtodos getFullYear() y setFullYear(), que funcionan bien en Netscape e Internet
Explorer.

Ejemplos de trabajo con fechas en Javascript

Visto lo anterior, ahora podemos poner los conocimientos en la prctica en un ejemplo completo de trabajo
con objetos de la 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)

//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()

//Escribimos en ao en la pgina

document.write("<br>El ao actual es: " + anoActual)

document.write("<br>El ao pasado es: " + anoPasado)

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 108 de 125

 Manual de JavaScript

//cambiamos el ao en la fecha actual

miFechaActual.setFullYear(2005)

//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)

Si se desea, se puede ver en funcionamiento este script en una pgina a parte.

Hay que destacar un detalle antes de acabar y es que el nmero del mes puede empezar desde 0. Por lo
menos en el Netscape con el que realizamos las pruebas empezaba en 0 el mes. Por esta razn sumamos
uno al mes que devuelve el mtodo getMonth.

Hay ms detalles a destacar, pues resulta que en Netscape el mtodo getFullYear() devuelve los aos
trascurridos desde 1900, con lo que al obtener el ao de una fecha de, por ejemplo, 2005, indica que es el
ao 105. Para obtener el ao completo tenemos a nuestra disposicin el mtodo getFullYear() que
devolvera 2005 del mismo modo en Netscape e Internet Explorer.

Mucha atencin, pues, al trabajo con fechas en distintas plataformas, puesto que podra ser problemtico el
hecho de que nos ofrezcan distintas salidas los mtodos de manejo de fechas, com siempre dependiendo de
la marca y versin de nuestro navegador.

Referencia: Se puede ver otro ejemplo de trabajo con la clase Date en el taller Calcular la edad en
Javascript

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 15/04/2002
Disponible online en http://desarrolloweb.com/articulos/clase-date-javascript.html

Clase Math en Javascript

La clase que utilizamos para realizar clculos matemticos de todo tipo.

La clase Math es una de las clases nativas de Javascript. Proporciona los mecanismos para realizar
operaciones matemticas en Javascript. Algunas operaciones se resuelven rpidamente con los operadores
aritmticos que ya conocemos, como la multiplicacin o la suma, pero hay una serie de operaciones
matemticas adicionales que se tienen que realizar usando la clase Math como pueden ser calcular un seno o
hacer una raiz cuadrada.

De modo que para cualquier clculo matemtico complejo utilizaremos la clase Math, con una
particularidad. Hasta ahora cada vez que queramos hacer algo con una clase debamos instanciar un objeto
de esa clase y trabajar con el objeto y en el caso de la clase Math se trabaja directamente con la clase. Esto se
permite por que las propiedades y mtodos de la clase Math son lo que se llama propiedades y mtodos de

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 109 de 125

 Manual de JavaScript

clase y para utilizarlos se opera a travs de la clase en lugar de los objetos. Dicho de otra forma, para trabajar
con la clase Math no deberemos utilizar la instruccin new y utilizaremos el nombre de la clase para acceder
a sus propiedades y mtodos.

Propiedades de 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.

Nmero E o constante de Euler, la base de los logaritmos neperianos.

LN2

Logaritmo neperiano de 2.

LN10

Logaritmo neperiano de 10.

LOG2E

Logaritmo en base 2 de E.

LOG10E

Logaritmo en base 10 de E.

PI

Conocido nmero para clculo con crculos.

SQRT1_2

Raiz cuadrada de un medio.

SQRT2

Raiz cuadrada de 2.

Mtodos de Math

As mismo, tenemos una serie de mtodos para realizar operaciones matemticas tpicas, aunque un poco

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 110 de 125

 Manual de JavaScript

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.

acos()

Devuelve el arcocoseno de un nmero en radianes.

asin()

Devuelve el arcoseno de un numero en radianes.

atan()

Devuelve un arcotangente de un numero.

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.

floor()

Lo contrario de ceil(), pues devuelve un nmero igual o inmediatamente inferior.

log()

Devuelve el logaritmo neperiano de un nmero.

max()

Retorna el mayor de 2 nmeros.

min()

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 111 de 125

 Manual de JavaScript

Retorna el menor de 2 nmeros.

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.

sin()

Devuelve el seno de un nmero con un ngulo en radianes.

sqrt()

Retorna la raiz cuadrada de un nmero.

tan()

Calcula y devuelve la tangente de un nmero en radianes.

Ejemplo de utilizacin de la clase Math

Vamos a ver un sencillo ejemplo sobre cmo utilizar mtodos y propiedaes de la clase Math para calcular el
seno y el coseno de 2 PI radianes (una vuelta completa). Como algunos de vosotros sabris, 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))

2 PI radianes es el resultado de multiplicar 2 por el nmero PI. Ese resultado es lo que recibe el mtodo cos,
y da como resultado 1. En el caso del seno el resultado no es exactamente 0 pero est aproximado con una
exactitud de ms de una millonsima de fraccin. Se escriben los el seno y coseno con un salto de lnea en
medio para que quede ms claro.

Podemos ver el resultado de ejecutar estas lneas de cdigo.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 112 de 125

 Manual de JavaScript

Adems, si deseamos profundizar en la clase Math os recomiendo leer el artculo de crear un nmero
aleatorio. Tambin se hace uso de la clase Math en el artculo enlace aleatorio. Todos en el Taller de
Javascript.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 25/04/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

Clase Number en Javascript

Clase que modeliza el tipo de datos numrico.

Vamos a ver a continuacin otra de las clases nativas de Javascript para trabajo con datos numricos. Se
trata de la clase Number, que modeliza el tipo de datos numrico y fue aadida en la versin 1.1 de
Javascript (con Netscape Navigator 3).

Como veremos en este artculo, la clase Number nos sirve para crear objetos que tienen datos numricos
como valor. Es muy probable que no lo llegues a utilizar en ninguna ocasin. Por lo menos en la mayora de
los scripts, para hacer las cosas ms dispares, no vas a utilizar esta clase, no obstante viene bien conocerla.

Nota: conocimos el tipo de datos numrico en el primer manual de javascript. Este nos serva para
guardar un valores numricos sin ms. Este objeto modeliza este tipo de datos y la clase en si, ofrece
algn mtodo que puede ser til. Para los clculos matemticos y el uso de nmeros en general vamos a
utilizar siempre las variables numricas vistas anteriormente.

El valor del objeto Number que se crea depende de lo que reciba el constructor de la clase Number. Con
estas reglas:

Si el constructor recibe un nmero, entonces inicializa el objeto con el nmero que recibe. Si recibe
un nmero entrecomillado lo convierte a valor numrico, devolviendo tambin dicho nmero.
Devuelve 0 en caso de que no reciba nada.
En caso de que reciba un valor no numrico devuelve NaN, que significa "Not a Number" (No es
un nmero).
Si recibe false se inicializa a 0 y si recibe true se inicializa a 1.

Su funcionamiento se puede resumir en estos ejemplos.

var n1 = new Number()

document.write(n1 + "<br>")

//muestra un 0

var n2 = new Number("hola")

document.write(n2 + "<br>")

//muestra NaN

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 113 de 125

 Manual de JavaScript

var n3 = new Number("123")

document.write(n3 + "<br>")

//muestra 123

var n4 = new Number("123asdfQWERTY")

document.write(n4 + "<br>")

//muestra NaN

var n5 = new Number(123456)

document.write(n5 + "<br>")

//muestra 123456

var n6 = new Number(false)

document.write(n6 + "<br>")

//muestra 0

var n7 = new Number(true)

document.write(n7 + "<br>")

//muestra 1

Este ejemplo y el siguiente, se pueden ver en una pgina a parte.

Propiedades de la clase Number

Esta clase tambin nos ofrece varias propiedades que contienen los siguientes valores:

NaN

Como hemos visto, significa Not a Number, o en espaol, no es un nmero.

MAX_VALUE y MIN_VALUE

Guardan el valor del mximo y el mnimo valor que se puede representar en Javascript

NEGATIVE_INFINITY y POSITIVE_INFINITY

Representan los valores, negativos y positivos respectivamente, a partir de los cuales hay desbordamiento.

Estas propiedades son de clase, as que accederemos a ellas a partir del nombre de la clase, tal como
podemos ver en este ejemplo en el que se muestra cada uno de sus valores.

document.write("Propiedad NaN: " + Number.NaN)

document.write("<br>")

document.write("Propiedad MAX_VALUE: " + Number.MAX_VALUE)

document.write("<br>")

document.write("Propiedad MIN_VALUE: " + Number.MIN_VALUE)

document.write("<br>")

document.write("Propiedad NEGATIVE_INFINITY: " + Number.NEGATIVE_INFINITY)

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 114 de 125

 Manual de JavaScript

document.write("<br>")

document.write("Propiedad POSITIVE_INFINITY: " + Number.POSITIVE_INFINITY)

Los dos ejemplos de este artculo se pueden ver en funcionamiento en una pgina a parte.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 14/05/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

Clase Boolean en Javascript

Otra de las clases incorporadas en Javascript, en este caso para crear valores boleanos a partir de
valores no boleanos.

En este artculo presentaremos otra de las clases nativas de Javascript, que es la clase Boolean. Esta clase
nos sirve para crear valores boleanos y fue aadida en la versin 1.1 de Javascript (con Netscape Navigator
3).

Una de sus posibles utilidades es la de conseguir valores boleanos a partir de datos de cualquier otro tipo.
No obstante, al igual que ocurra con la clase Number, es muy probable que no la llegues a utilizar nunca.

Nota: conocimos el tipo de datos boolean en el primer manual de Javascript. Este nos serva para
guardar un valor verdadero (true) o falso (false). Esta clase modeliza ese tipo de datos para crear objetos
boleanos.

Dependiendo de lo que reciba el constructor de la clase Bolean el valor del objeto boleano que se crea ser
verdadero o falso, de la siguiente manera

Se inicializa a false

Cuando no pasas ningn valor al constructor, o si pasas una cadena vaca, el nmero 0 o la palabra false sin
comillas.

Se inicializa a true

Cuando recibe cualquier valor entrecomillado o cualquier nmero distinto de 0.

Se puede comprender el funcionamiento de este objeto fcilmente si examinamos unos ejemplos.

var b1 = new Boolean()

document.write(b1 + "<br>")

//muestra false

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 115 de 125

 Manual de JavaScript

var b2 = new Boolean("")

document.write(b2 + "<br>")

//muestra false

var b25 = new Boolean(false)

document.write(b25 + "<br>")

//muestra false

var b3 = new Boolean(0)

document.write(b3 + "<br>")

//muestra false

var b35 = new Boolean("0")

document.write(b35 + "<br>")

//muestra true

var b4 = new Boolean(3)

document.write(b4 + "<br>")

//muestra true

var b5 = new Boolean("Hola")

document.write(b5 + "<br>")

//muestra true

Se puede ver en funcionamiento el ejemplo en una pgina a parte.

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 14/05/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 116 de 125

 Manual de JavaScript

Eplogos a esta primera parte del Manual

de Javascript

Con estos artculos terminaremos la primera parte del manual de Javascript de DesarrolloWeb.com. Aqu
veremos por dnde continuar estas explicaciones y algunos temas de inters como el control de errores en
los programas.

Pausa y consejos Javascript

Hacemos una pausa en el manual de Javascript para ofrecer una serie de consejos tiles.

Hasta aqu hemos visto la mayor parte de la sintaxis y forma de funcionar de el lenguaje Javascript. Ahora
podemos escribir scripts simples que hagan uso de variables, funciones, arrays, estructuras de control y toda
clase de operadores. Con todo esto conocemos el lenguaje, pero aun queda mucho camino por delante para
dominar Javascript y saber hacer todos los efectos posibles en pginas web, que en definitiva es lo que
interesa.

De todos modos, este manual nos lo hemos tomado con mucha calma, con intencin de que las personas
que no estn familiarizadas con el mundo de la programacin puedan tambin tener acceso al lenguaje y
aprendan las tcnicas bsicas que permitirn afrontar futuros retos en la programacin. Esperamos entonces
que la lectura del manual haya sido provechosa para los ms inexpertos y que ahora puedan entender con
facilidad las siguientes lecciones o ejemplos, ya que conocen las bases sobre las que estn implementados.

Antes de acabar, vamos a dar una serie de consejos a seguir a la hora de programar nuestros scripts, que nos
pueden ayudar a hacernos la vida ms fcil. Algunos consejos son nuevos e importantes, otros se han
sealado con anterioridad, pero sin duda viene bien recordar.

Distintos navegadores

Lo primero importante en sealar es que Javascript es un lenguaje muy dinmico y que ha sido
implementado poco a poco, a medida que salan nuevos navegadores. Si pensamos en el Netscape 2, el
primer navegador que inclua Javascript, y el Netscape 6 o Internet Explorer 6 nos daremos cuenta que han
pasado un mundo de novedades entre ellos. Javascript ha cambiado por lo menos tanto como los
navegadores y eso representa un problema para los programadores, porque tienen que estar al tanto de las
distintas versiones y la manera de funcionar que tienen.

Actualizado: a da de hoy todava las diferencias entre los navegadores antiguos y los nuevos es todava
ms patente. Incluso, ahora que aparece el HTML 5, existen muchos otros usos donde Javascript tiene
validez.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 117 de 125

 Manual de JavaScript

Las bases de javascript, sobre las que hemos hablado hasta ahora, no han cambiado prcticamente nada.
Slo en algunas ocasiones, que hemos sealado segn las conocamos -como los arrays por ejemplo-, el
lenguaje ha evolucionado un poco. Sin embargo, a medida que nuevas tecnologas como el DHTML se
desarrollaban, los navegadores han variado su manera de manejarlas.

Nuestro consejo es que esteis al tanto de las cosas que funcionan en unos u otros sistemas y que programis
para que vuestras pginas sean compatibles en el mayor nmero de navegadores. Para procurar esto ltimo
es muy aconsejable probar las pginas en varias plataformas distintas. Tambin es muy til dejar de lado los
ltimos avances, es decir, no ir a la ltima, sino ser un poco conservadores, para que las personas que han
actualizado menos el browser puedan tambin visualizar los contenidos.

Consejos para hacer un cdigo sencillo y fcil de mantener

Ahora vamos a dar una serie de consejos para que el cdigo de nuestros scripts sea ms claro y libre de
errores. Muchos de ellos ya los hemos sealado y somos libres de aplicarlos o no, pero si lo hacemos
nuestra tarea como programadores puede ser mucho ms agradable, no slo hoy, sino tambin el da que
tengamos que revisar los scripts en su mantenimiento.

Utiliza comentarios habitualmente para que lo que ests haciendo en los scripts pueda ser recordado
por ti y cualquier persona que tenga que leerlos ms adelante.
Ten cuidado con el mbito de las variables, recuerda que existen variables globales y locales, que
incluso pueden tener los mismos nombres y conoce en cada momento la variable que tiene validez.
Escribe un cdigo con suficiente claridad, que se consigue con saltos de lnea despus de cada
instruccin, un sangrado adecuado (poner mrgenes a cada lnea para indicar en qu bloque estn
incluidas), utilizar las llaves {} siempre, aunque no sean obligatorias y en general mantener siempre
el mismo estilo a la hora de programar.
Aplica un poco de consistencia al manejo de variables. Declara las variables con var. No cambies el
tipo del dato que contiene (si era numrica no pongas luego texto, por ejemplo). Dales nombres
comprensibles para saber en todo momento qu contienen. Incluso a la hora de darles nombre
puedes aplicar una norma, que se trata de que indiquen en sus nombres el tipo de dato que
contienen. Por ejemplo, las variables de texto pueden empezar por una s (de String), las variables
numricas pueden empezar por una n o las boleanas por una b.
Prueba tus scripts cada poco a medida que los vas programando. Puedes escribir un trozo de cdigo
y probarlo antes de continuar para ver que todo funciona correctamente. Es ms fcil encontrar los
errores de cdigo en bloques pequeos que en bloques grandes.

En el resto de esta primera parte del manual de Javascript vamos a ver un par de cosas tambin
fundamentales en el trabajo del da a da con este lenguaje, como son la deteccin de errores. Adems, os
dejamos unas referencias importantes para continuar con el aprendizaje:

Manual de Javascript II: la segunda parte de este manual abordar usos de Javascript para control de
los elementos de las pginas web.
Videotutorial de Javascript: estamos publicando una serie de videotutoriales de Javascript que te
encantarn si quieres aprender por la prctica.
Javascript a fondo: todo lo que tiene que ver con Javascript lo encontrars en esta seccin de
DesarrolloWeb.com.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 118 de 125

 Manual de JavaScript

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 10/01/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

Tratamiento de errores en javascript

Vamos a explicar los errores comunes que podemos cometer y cmo evitarlos y depurarlos.
Adems veremos una pequea conclusin a la primera parte del manual.

Hemos terminado ya de explicar todo el contenido de la primera parte del manual de javascript, pero aun
tenemos algunas cosas importantes que tratar. En concreto en este artculo vamos a explicar los errores
comunes que podemos cometer y cmo evitarlos y depurarlos. Adems veremos una pequea conclusin a
esta parte del manual.

Errores comunes en Javascript

Cuando ejecutamos los scripts pueden ocurrir dos tipos de errores de sintaxis o de ejecucin, los vemos a
continuacin.

Errores de sintaxis ocurren por escribir de manera errnea las lneas de cdigo, equivocarse a la hora de
escribir el nombre de una estructura, utilizar incorrectamente las llaves o los parntesis o cualquier cosa
similar. Estos errores los indica javascript a medida que est cargando los scripts en memoria, lo que hace
siempre antes de ejecutarlos, como se indic en los primeros captulos. Cuando el analizador sintctico de
javascript detecta un error de estos se presenta el mensaje de error.

Errores de ejecucin ocurren cuando se estn ejecutando los scripts. Por ejemplo pueden ocurrir cuando
llamamos a una funcin que no ha sido definida. javascript no indica estos errores hasta que no se realiza la
llamada a la funcin.

La manera que tiene javascript de mostrar un error puede variar de un navegador a otro. En versiones
antiguas se mostraba una ventanita con el error y un botn de aceptar, tanto en Internet Explorer como en
Netscape. En la actualidad los errores de javascript permanecen un poco ms ocultos al usuario. Esto viene
bien, porque si nuestras pginas tienen algn error en alguna plataforma no ser muy molesto para el
usuario que en muchas ocasiones ni se dar cuenta. Sin embargo para el programador puede ser un poco
ms molesto de revisar y se necesitar conocer la manera de que se muestren los errores para que puedan
ser reparados.

En versiones de Internet Explorer mayores que la 4 se muestra el error en la barra de estado del navegador
y se puede ver una descripcin ms grande del error si le damos un doble click al icono de alerta amarillo
que aparece en la barra de estado. En Netscape aparece tambin un mensaje en la barra de estado que
adems nos indica que para mostrar ms informacin debemos teclear "javascript:" en la barra de
direcciones (donde escribimos las URL para acceder a las pginas). Con eso conseguimos que aparezca la
Consola javascript, que nos muestra todos los errores que se encuentran en las pginas.

Tambin podemos cometer fallos en la programacin que hagan que los scripts no funcionen tal y como
desebamos y que javascript no detecta como errores y por lo tanto no muestra ningn mensaje de error.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 119 de 125

 Manual de JavaScript

Por dejarlo claro vamos a ver un ejemplo en el que nuestro programa puede no funcionar como deseamos
sin que javascript ofrezca ningn mensaje de error. En este ejemplo trataramos de sumar dos cifras pero si
una de las variables es de tipo texto podramos encontrarnos con un error.

var numero1 = 23

var numero2 = "42"

var suma = numero1 + numero2

Cunto vale la variable suma? Como muchos ya sabis, la variable suma vale "2342" porque al intentar
sumar una variable numrica y otra textual, se tratan a las dos como si fueran de tipo texto y por lo tanto, el
operador + se aplica como una concatenacin de cadenas de caracteres. Si no estamos al tanto de esta
cuestin podramos tener un error en nuestro script ya que el resultado no es el esperado y adems el tipo
de la variable suma no es numrico sino cadena de caracteres.

Evitar errores comunes

Vamos a ver ahora una lista de los errores tpicos cometidos por inexpertos en la programacin en general y
en javascript en particular, y por no tan inexpertos.

Utilizar = en expresiones condicionales en lugar de == es un error difcil de detectar cuando se comete, si

utilizamos un solo igual lo que estamos haciendo es una asignacin y no una comparacin para ver si dos
valores son iguales.

No conocerse la precedencia de operadores y no utilizar parntesis para agrupar las operaciones que se
desea realizar. En este caso nuestras operaciones pueden dar resultados no deseados.

Usar comillas dobles y simples errneamente. Recuerda que se pueden utilizar comillas dobles o simples
indistintamente, con la norma siguiente: dentro de comillas dobles se deben utilizar comillas simples y
viceversa.

Olvidarse de cerrar una llave o cerrar una llave de ms.

Colocar varias sentencias en la misma lnea sin separarlas de punto y coma. Esto suele ocurrir en los
manejadores de eventos, como onclick, que veremos ms adelante.

Utilizar una variable antes de inicializarla o no declarar las variables con var antes de utilizarlas tambin son
errores comunes. Recuerda que si no la declaras puedes estar haciendo referencia a una variable global en
lugar de una local.

Contar las posiciones de los arrays a partir de 1. Recuerda que los arrays empiezan por la posicin 0.

Depurar errores 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, como vimos anteriormente, pero que hacen que los

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 120 de 125

 Manual de JavaScript

programas no funcionen como esperbamos.

Nota: Para aprender a utilizar las herramientas de deteccin de errores Javascript ms populares,
recomendamos especialmente ver el videotutorial sobre detectar errores Javascript en pginas web.

Para todo tipo de errores, unos ms fciles de detectar que otros, debemos utilizar alguna tcnica de
depuracin que nos ayude a encontrarlos. Lenguajes de programacin ms potentes que el que tratamos
ahora incluyen importantes herramientas de depuracin, pero en javascript debemos contentarnos con una
rudimentaria tcnica. Se trata de utilizar una funcin predefinida, la funcin alert() que recibe entre
parntesis un texto y lo muestra en una pequea ventana que tiene un botn de aceptar.

Con la funcin alert() podemos mostrar en cualquier momento el contenido de las variables que estamos
utilizando en nuestros scripts. Para ello ponemos entre parntesis la variable que deseamos ver su
contenido. Cuando se muestra el contenido de la variable el navegador espera a que apretemos el botn de
aceptar y cuando lo hacemos contina con las siguientes instrucciones del script.

Este es un sencillo ejemplo sobre cmo se puede utilizar la funcin alert() para mostrar el contenido de las
variables.

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)

Con la funcin alert() se muestra el contenido de las dos variables que utilizamos en el script. Algo similar a
esto es lo que tendremos que hacer para mostrar el contenido de las variables y saber cmo estn
funcionando nuestros scripts, si todo va bien o hay algn error.

Conclusin

Hasta aqu hemos conocido la sintaxis javascript en profundidad. Aunque aun nos quedan cosas
importantes de sintaxis, la visin que has podido tener del lenguaje ser suficiente para enfrentarte a los
problemas ms fundamentales. En adelante presentaremos otros reportajes para aprender a utilizar los
recursos con los que contamos a la hora de hacer efectos en pginas web.

Veremos la jerarqua de objetos del navegador, cmo construir nuestros propios objetos, las funciones
predefinidas de javascript, caractersticas del HTML Dinmico, trabajo con formularios y otras cosas
importantes para dominar todas las posibilidades del lenguaje.

Todo ello en nuestro manual de Javascript II y en el Taller de Javascript.

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 121 de 125

 Manual de JavaScript

Este artculo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 11/02/2002
Disponible online en http://desarrolloweb.com/articulos/20.php

Consejos para escribir cdigo Javascript

En este artculo puedes encontrar varios consejos bastante interesantes a la hora de programar
cdigo Javascript.

Si estas dando tus primeros pasos en Javacript y estas empezando ya a ser sucio y desordenado... No tienes
excusa da un giro para escribir el cdigo ordenado y todo ser ms sencillo.

Los foros estan llenos de peticiones de informacin sobre Ajax, DOM y como se usan algunas libreras o
efectos. Hay una extraordinaria cantidad de informacin, scripts, libreras que estan siendo desarrollados,
blogs y nuevos sitios especializados en esta temtica, slo necesitas un poco de tiempo y echarle un vistazo...
es muy fcil los mejores los encuentras en Digg.com o en del.icio.us, se acabaron aquellos das en el que
Javascript y el DHTML se convirtieron en persona non grata como habilidad principal en tu CV.

La gran mayora de cdigo Javascript es hoy en dia mucho ms limpio que en la "era" DHTML.

Ahora es un buen momento para convertirte en un entusiasta de Javascript. Aunque algunos defectos que
ocurrieron tiempo atras se repiten sin embargo.

Aqu os dejo una series de consejos que os har ms sencillo mantener tu cdigo Javascript ordenado,
algunos consejos son demasiado obvios pero todos sabemos que el hombre es el nico animal que...

Conserva la sintaxis y estructura de tu cdigo limpia y ordenada

Esto significa que guardes por ejemplo un lmite de longitud de lnea (80 caracteres) y que programes
funciones razonablemente pequeas. Un fallo es pensar que en una funcin larga lo podemos hacer todo.

Tener un tamao razonable para tus funciones significa que las podrs reutilizar cuando amplies el cdigo,
tampoco seas extremista y hagas funciones de una o dos lneas esto puede llegar a ser ms confuso que usar
una nica funcin.

Este es un ejemplo que muestra cual es la justa medida en cuanto al tamao de las funciones y la divisin de
las tareas:

function toolLinks(){

var tools = document.createElement('ul');

var item = document.createElement('li');

var itemlink = document.createElement('a');

itemlink.setAttribute('href', '#');

itemlink.appendChild(document.createTextNode('close'));

itemlink.onclick = function(){window.close();}

item.appendChild(itemlink);

tools.appendChild(item);

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 122 de 125

 Manual de JavaScript

var item2 = document.createElement('li');

var itemlink2 = document.createElement('a');

itemlink2.setAttribute('href', '#');

itemlink2.appendChild(document.createTextNode('print'));

itemlink2.onclick = function(){window.print();}

item2.appendChild(itemlink2);

tools.appendChild(item2);

document.body.appendChild(tools);

Puedes optimizar esta funcin separando cada tarea con su propia funcin:

function toolLinks(){

var tools = document.createElement('ul');

var item = document.createElement('li');

var itemlink = createLink('#', 'close', closeWindow);

item.appendChild(itemlink);

tools.appendChild(item);

var item2 = document.createElement('li');

var itemlink2 = createLink('#', 'print', printWindow);

item2.appendChild(itemlink2);

tools.appendChild(item2);

document.body.appendChild(tools);

function printWindow(){

window.print();

function closeWindow() {

window.close();

function createLink(url,text,func){

var temp = document.createElement('a');

temp.setAttribute('href', url);

temp.appendChild(document.createTextNode(text));

temp.onclick = func;

return temp;

Utiliza inteligentemente los nombres de variables y funciones

Esta es un tcnica esencial de programacin, utiliza nombres de variables y funciones que sean totalmente
descriptivos e incluso otra persona pueda llegar a plantearse que funcin realizan antes de ver el cdigo.

Recuerda que es correcto el uso de guiones o maysculas para concatenar diferentes palabras, en este caso
concreto de es ms tpico el uso de maysculas debido a la sintaxis del lenguaje, (ej.
getElementsByTagName()).

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 123 de 125

 Manual de JavaScript

CambioFormatoFecha();

cambio_formato_fecha();

Comenta el cdigo

Gracias a los comentarios puedes librarte de ms de un quebradero de cabeza, es mejor resolver el problema
una nica vez.

Cmo puedes comprobar en cualquier libro de programacin cada lnea tiene comentarios explicando su
objetivo.

Diferencia las variables dependiendo de su importancia

Este paso es simple: Coloca aquellas variables que son usadas durante todo el script en la cabecera del
cdigo, de esta maneras siempre sabrs donde encontrar estas variables que son las que determinan el
resultado de nuestro cdigo.

function toolLinks(){

var tools, closeWinItem, closeWinLink, printWinItem, printWinLink;

// variables temporales

var printLinkLabel = ?print?;

var closeLinkLabel = ?close?;#

tools = document.createElement(?ul?);

closeWinItem = document.createElement(?li?);

closeWinLink = createLink(?#', closeLinkLabel, closeWindow);

closeWinItem.appendChild(closeWinLink);

tools.appendChild(closeWinItem);

printWinItem = document.createElement(?li?);

printWinLink = createLink(?#', printLinkLabel, printWindow);

printWinItem.appendChild(printWinLink);

tools.appendChild(printWinItem);

document.body.appendChild(tools);

Separa el texto del cdigo

Puedes separar el texto del cdigo, utilizando un documento llamado texto.js en formato JSON.

Un ejemplo que funciona muy bien podra ser:

var locales = {

'en': {

'homePageAnswerLink':'Answer a question now',

'homePageQuestionLink':'Ask a question now',

'contactHoverMessage':'Click to send this info as a message',

'loadingMessage' : 'Loading your data...',

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 124 de 125

 Manual de JavaScript

'noQAmessage' : 'You have no Questions or Answers yet',

'questionsDefault': 'You have not asked any questions yet',

'answersDefault': 'You have not answered any questions yet.',

'questionHeading' : 'My Questions',

'answersHeading' : 'My Answers',

'seeAllAnswers' : 'See all your Answers',

'seeAllQuestions' : 'See all your Questions',

'refresh': 'refresh'

},

'es': {

'homePageAnswerLink':'Responde una pregunta',

'homePageQuestionLink':'Haz una pregunta',

'contactHove' : 'Cargando datos...',

'noQAmessage' : 'No quedan preguntas',

'questionsDefault': 'Quedan preguntas por responder',

'answersDefault': 'No quedan preguntas pendientes',

'questionHeading' : 'Mis preguntas',

'answersHeading' : 'Mis respuestas',

'seeAllAnswers' : 'Ver todas las respuestas',

'seeAllQuestions' : 'Ver todas las preguntas',

'refresh': 'Refrescar'

},

'fr': {

'de': {

};

Esto permitira a cualquiera que no es programador traducir el texto del script, cambiando unicamente las
etiquetas sin necesidad de acceder al cdigo.

Documenta el cdigo

Escribe una buena documentacion de tu script / librera o efecto. Una buena documentacin da calidad al
cdigo, sino preguntate porque existe la clsica documentacin en cualquier API con todas las posibles
propiedades y parametros, pero sin duda lo mejor de todo es explicar con ejemplos que contienen una lista
de posibilidades.

Este artculo es obra de Manu Gutierrez

Fue publicado por primera vez en 20/12/2007
Disponible online en http://desarrolloweb.com/articulos/consejos-para-escribir-codigo-javascript.html

http://desarrolloweb.com/manuales/manual-javascript.html Pgina 125 de 125