You are on page 1of 10

JavaScript orientado a desarrollo web y objetos

Gua de trabajo (v1.0)


Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

JAVASCRIPT
Un enfoque bsico al desarrollo de la programacin orientada a objetos y pginas web

Bienvenidos a JavaScript durante el desarrollo de la siguiente gua, encontraran las herramientas bsicas
y/o necesarias para ampliar el conocimiento sobre el tema de exposicin y para poder desarrollar los ejercicios
propuestos de forma conjunta, con ello se espera una respuesta positiva y participativa del aprendiz.

1. Qu es JavaScript?

JavaScript es un lenguaje de programacin que permite crear programas y sitios web prcticamente
idnticos a cualquier aplicacin de escritorio, en cuanto a su respuesta se refiere; fue desarrollado en 1995
por la compaa Netscape, y su principal objetivo es la interactividad en programas y sitios Web, mediante
la manipulacin de objetos.

1.1 Caractersticas

Multiplataforma, ya que se puede utilizar en Windows, Linux o Mac o en el navegador de tu


preferencia.
Es Imperativo y estructurado, mediante un conjunto de instrucciones indica al computador qu tarea
debe realizar.
Prototipado, debido a que usa prototipos en vez de clases para el uso de herencia.
Orientado a objetos y eventos.
Es Interpretado, no se compila para poder ejecutarse.

1.2 Qu es un SCRIPT?

Un SCRIPT no es ms que un programa creado con JavaScript sea cual sea su funcin. Cuando aadimos
JavaScript a un sitio web, ya estamos generando un script. Por esta razn, podemos intuir que puede haber
programas de JavaScript simples y cortos y otros complicados y muy extensos.

1.3 Variables

Una variable no es ms que un contenedor para un valor. Las variables se declaran por medio de la
palabra clave VAR (locales y si Var, globales), pero a diferencia de otros lenguajes de programacin en
JavaScript no es necesario declarar su tipo.

Ver: Anexo #1: Funciones Principales.


JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

1.4 IDENTIFICADORES

La regla generar para construir nombres de variables (identificadores nicos) son:


Los nombres pueden contener letras, dgitos, guion bajo, y signos de dlar.
Los nombres deben empezar con una letra.
Nombres tambin pueden empezar con $ y _.
Los nombres distinguen entre maysculas y minsculas (X y x) son diferentes variables).
Palabras reservadas (Anexo #2: Palabras reservadas) como 'JavaScript u otras no se pueden usar
como nombres.

2. SENTENCIAS CONDICIONALES

El lenguaje de programacin JavaScript est basado en las denominadas sentencias condicionales, es decir,
en preguntas del tipo s/no o verdadero/falso. Segn sea la respuesta a estas preguntas, el programa deber
comportarse de un modo u otro dando sentido as al trmino condicional.

Funciones como prompt (), if (if anidados), if-else, for y switch son funciones que van de la mano a la hora
de aplicar condicionales en el lenguaje de JavaScript.

Ver: Anexo #3: Sentencias Condicionales

3. Estructuras de repeticin

En JavaScript, un bucle (en ingls, loop) es la ejecucin de la misma tarea repetidas N veces. Hay que tener
en cuenta que, en muchas ocasiones, en un mismo script, ser necesario ejecutar la misma accin muchas
veces; por esta razn, JavaScript permite gestionar las tareas repetitivas de distintas maneras.

Estructuras como do/while, while, for y los acumuladores, pertenecen a este grupo de estructuras.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Ver: Anexo #4: Estructuras de repeticin

4. Funciones

En JavaScript, las funciones son series de pasos que se configuran al inicio del script. Dichos pasos no
se ejecutan al crear la funcin, sino que quedan almacenados en la memoria del navegador web y son
llamados cuando son necesarios. Las funciones tienen un valor incalculable debido a que pueden
gestionar mltiples pasos programados de forma repetida.

Dividindose en dos categoras:

Funciones que retornan valores.


Funciones que no retornan valores.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Ver: Anexo #5: Funciones especiales

5. ARRAYS

Al igual que en la mayor parte de los lenguajes de programacin, en JavaScript podemos trabajar con
arrays (tambin llamados arreglos, vectores o matrices). Los arrays son de gran importancia ya que
permiten organizar series de datos.

Se declaran de la siguiente forma:

var pases= [Colombia, Brasil, Francia];

O se pueden declarar como array vaco, de las siguientes formas:

var fruta= [];


var fruta=new Array ();

Propiedades del array:

Lenght

La funcin cuenta la cantidad de elementos que posee el array.

Push y Pop

La funcin Push agrega un elemento en el ltimo lugar del array. La funcin pop elimina el ltimo
elemento existente.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Concat

La funcin Concat, concatena varios arrays en uno, es decir, se crea un nuevo array con la informacin de
los arrays concatenados dentro de esta funcin.

Join

La funcin separa cada uno de los elementos del array con el smbolo, numero, etc., que se introduzca
dentro de los parntesis de la funcin.

Sort

La funcin Sort ordena el array ascendentemente en caso de que los elementos sean nmeros, en caso de
elementos char, son ordenados alfabticamente.

Anexos:

Anexo #1: Funciones Principales.

Document.write: Uno de los comandos bsicos de JavaScript es document.write. Esto imprime el texto
especificado en la pgina. Para imprimir texto literalmente, escribe el texto en comillas simples y entre
parntesis.

Alert: Es la encargada de mostrar una pequea ventana de aviso en la pantalla, as, si se requiere
que aparezca un mensaje cuando ocurra determinada accin en el programa, podemos hacer uso de
esta funcin. La funcin alert recibe como parmetro el mensaje que se debe mostrar en la ventana.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Prompt: Al igual que la funcin alert, la funcin prompt es tambin un mtodo del objeto Window.
Esta funcin se utiliza cuando el usuario ingresa datos por medio del teclado. Con esta funcin aparece
una ventana en la pantalla, con un espacio para el valor que se debe ingresar y un botn aceptar para
que la informacin sea guardada. Esta funcin recibe dos parmetros, el primero es el mensaje que se
muestra en la ventana y el segundo es el valor inicial del rea de texto.

Anexo #2: Palabras Reservadas.

Las siguientes son palabras reservadas y no pueden ser utilizadas como variables, funciones, mtodos o
identificadores de objetos.

break, case, class, catch, const, continue, debugger, default, delete, do, else, export, extends, finally, for,
function, if, import, in, instanceof, let, new, return, super, switch, this, throw, try, typeof, var, void, while, with,
yield, implements, package, protected, static, interface, private, public, abstract, boolean, byte, char, double,
final, float, goto, int, long, native, short, synchronized, transient, volatile.

Anexo #3: Sentencias Condicionales.

If Else: Por medio de if se puede indicar una condicin que, de cumplirse, permite la ejecucin de
uno o ms enunciados. Por medio de else se puede establecer una alternativa, aunque su uso es opcional.
(Se pueden concatenar tantos else if como se quiera)

Switch: Por medio de switch se puede listar una serie de bloques de enunciados que se ejecuten
dependiendo del valor de una variable.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Operadores Lgicos: Los operadores lgicos amplan las posibilidades de establecer condiciones.

Anexo #4: Ciclos De Repeticin.

FOR: Un bucle for nos permite repetir un bloque de cdigo segn unas condiciones concretas.

While: El bucle while, al igual que el bucle for, tambin es condicional, aunque mucho ms simple
que ste.

Do While: La sentencia do...while se repite hasta que una condicin especificada se evala a false.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Sentencia Label: Un label proporciona una sentencia con un identificador que permite referirse a l
desde cualquier lugar de su programa. Por ejemplo, usted puede usar un label para identificar un bucle,
y usar las sentencias break o continue para indicar si el programa debe interrumpir un bucle o continuar
su ejecucin.

El valor de label puede ser cualquier identificador JavaScript que no sea una palabra reservada. La
sentencia que usted identifique con un label podr ser cualquier sentencia.

En este ejemplo, el label markLoop identifica a un bucle while.

Sentencia Break: Use la sentencia break para salir de un bucle, switch, o en conjunto con una
sentencia label.

Cuando use break sin un label, finaliza inmediatamente el cdigo encerrado en while, do-while, for, o
switch y transfiere el control a la siguiente sentencia.

Cuando usted use break con un label, termina la sentencia especificada por label.

La sintaxis de la sentencia break es la siguiente:

break;
break label;

La primera forma de la sintaxis finaliza con lo encerrado por el bucle o switch; la segunda finaliza lo
especificado por la sentencia label.

El siguiente ejemplo itera a travs de los elementos en un array hasta que encuentra que un ndice de
un elemento cuyo valor es elValor:
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Ejemplo 2, Break a un label:

Sentencia Continue: La sentencia continue puede usarse para reiniciar una sentencia while, do-
while, for, o label.

Cuando use continue sin un label, este termina la iteracin en curso del cdigo encerrado en una
sentencia while, do-while, o for y contina la ejecucin del bucle con la siguiente iteracin. A
diferencia de la sentencia break, continue no termina completamente la ejecucin del bucle.

En un bucle while, salta atrs hasta la condicin. En un bucle for, salta a la expresin Incremento.

Cuando use continue con una etiqueta, esto se aplica a las sentencias anidadas identificadas con una
etiqueta.

La sintaxis de la sentencia continue es la siguiente:

continue;
continue label;

El siguiente ejemplo muestra un bucle while con una sentencia continue que se ejecuta cuando el
valor de i es tres. As, n toma los valores uno, tres, siete, y doce.
JavaScript orientado a desarrollo web y objetos
Gua de trabajo (v1.0)
Exposicin desarrollada Por:
Jairo Camacho, Ricardo Vergel, Andres Parra, Julin Jerez.
GUIA SINSTAXIS BASICA-HERRAMIENTAS-ACTIVIDADES EN JAVASCRIPT

Anexo #5: Funciones Especiales.

1. Parse

Al pedir informacin en el navegador, JavaScript toma estos datos como un stream y no se pueden tratar
como posiblemente se quieren usar. Para convertir estos datos a enteros o flotantes se utiliza la funcin
Parse, la cual devuelve un valor de acuerdo a lo que se requiera.

Alert

Se muestra un cuadro de dialogo en la pgina con la variable o dato indicado dentro de la funcin.

arr.sort([compareFunction])

Si no se provee compareFunction, los elementos son ordenados convirtindolos a strings y comparando la


posicin del valor Unicode de dichos strings. Por ejemplo, "Cherry" viene antes que "banana" (por ir las
maysculas antes que las minsculas en la codificacin Unicode). En un ordenamiento numrico, 9 viene
antes que 80, porque, los nmeros son convertidos a strings y "80" se encuentra antes que "9" en Unicode.

Si compareFunction(a, b) es menor que 0, se sita a en un ndice menor que b. Es decir, a viene primero.
Si compareFunction(a, b) retorna 0, se deja a y b sin cambios entre ellos, pero ordenados con respecto
a todos los elementos diferentes. Nota: el estndar ECMAscript no garantiza este comportamiento, por esto
no todos los navegadores (p.ej. Mozilla en versiones que datan hasta el 2003) respetan esto.
Si compareFunction(a, b) es mayor que 0, se sita b en un ndice menor que a.
compareFunction(a, b) siempre debe retornar el mismo valor dado un par especifico de elementos a y
b como sus argumentos. Si se retornan resultados inconsistentes entonces el orden de ordenamiento es
indefinido.