JavaScript: lenguaje de programación para páginas web

JAVASCRIPT
JAVA Script es un lenguaje interpretado,
multiplataforma, orientado a eventos con manejo
de objetos, cuyo código se incluye directamente en
el mismo documento, usado para el desarrollo de
aplicaciones cliente-servidor en paginas HTML.

JavaScript se diseñó con una sintaxis similar al C,
aunque adopta nombres y convenciones del
lenguaje de programación Java. Sin embargo
Java y JavaScript no están relacionados y tienen
semánticas y propósitos diferentes.

HISTORIA
JavaScript fue desarrollado originalmente por
Brendan Eich de Netscape con el nombre de
Mocha, el cual fue renombrado posteriormente
a LiveScript, para finalmente quedar como
JavaScript.

Hasta entonces ya se usaba HTML y JAVA, pero
la aparición del JAVA Script produjo una
importante revolución, ya que dio al usuario la
posibilidad crear aplicaciones "on-line" osea
modificar páginas web en tiempo real, sin usar
CGI´s.

CARACTERÍSTICAS
Javascript es muy fácil de aprender para quien
ya conoce lenguajes similares como el C++ o
Java, pero, dada su simplicidad sintáctica y su
manejabilidad, no es tampoco difícil para quien
se acerca por primera vez a este lenguaje

• Es un lenguaje de scripting por excelencia
• Es seguro y fiable
• Tiene capacidades limitadas, por razones de
seguridad
• El código es visible y puede ser leído por
cualquiera
• El código se ejecuta en el cliente
• El código debe descargarse completamente

¿QUÉ ES UN LENGUAJE SCRIPT?
• Scripting – system programming
– Unos no sustituyen a los otros sino que están
orientados a cosas diferentes

• Extienden las capacidades de la aplicación
con la que trabajan
• Raramente se usan para algoritmos y
estructuras de datos complejas
• Tienden a ser Typeless
–
–
–
–

Detección de errores en tiempo de ejecución
Código y datos son intercambiables
Un programa puede escribir otro y ejecutarlo
Menos código y programas más flexibles

• Problemas de SEGURIDAD

¿QUÉ ES JAVASCRIPT?
•
•
•
•

Es un lenguaje Script
Extiende las capacidades de las páginas Web
El código está integrado en el HTML
Se interpreta en el ordenador que recibe el
HTML, no se compila
• Ejecución dinámica
– Los programas y funciones no se chequean hasta
que se ejecutan

• Tiene programación orientada a objetos
• Trabaja con los elementos del HTML
• No se declaran los tipos de variables

GENERALIDADES DE JAVASCRIPT
• Modelo orientado al WWW
• Elementos de una página HTML pueden
causar un evento que ejecutará una acción
• Esa acción se ejecutará a través de una serie
de sentencias JavaScript
• Comandos de JavaScript:
–
–
–
–
–

Variables
Expresiones
Estructuras de control
Funciones (bloques de sentencias)
Clases, objetos y arrays (agrupaciones de datos)

La TAG <SCRIPT> </SCRIPT>
• Sintaxis
<SCRIPT type="text/javascript" src="fuente.js"></SCRIPT>

• Atributo SRC: fichero código fuente
<SCRIPT type="text/javascript">
function valor_abs(form) {
var num = eval(form.expr.value)
if (num >= 0) form.result.value = num
else num = -num
form.result.value = num
}
</SCRIPT>

• Colocarlo en la sección <HEAD> del HTML
– No es necesario que esté todo el código allí
– Asegura que todo el código haya sido definido antes
del <BODY> del documento.

MODELO DE EVENTOS DE JAVASCRIPT
• Los eventos suceden a tres niveles:

– A nivel del documento HTML
– A nivel de un formulario individual
– A nivel de un elemento de un formulario

• El evento es gestionado por una sección de
código en JavaScript (Gestor de Eventos)
• Declaración de Gestores de Eventos: similar
a los atributos en HTML
<BODY onLoad="cargarfuncion()" onUnload="descargarfuncion()">

<FORM name="nombre_del_formulario" ...
onSubmit="función_o_sentencia">
<INPUT type="button" name="mycheck" value="HA!" onClick=
"alert(‘Te he dicho que no me aprietes’)">

GESTORES DE EVENTOS (EVENT HANDLERS)
Evento

Ocurre Cuando

Gestor

blur

El usuario quita el cursor de un elemento de formulario

onBlur

click

El usuario clica un link o un elemento de formulario

onClick

change

El usuario cambia el valor de un texto, un área de texto o
selecciona un elemento.

onChange

focus

El usuario coloca el cursor en un elemento de formulario.

onFocus

load

El usuario carga una página en el Navegador

onLoad

Mouseover

El usuario mueve el ratón sobre un link

onMouseOver

Select

El usuario selecciona un campo del elemento de un formulario

onSelect

Submit

Se envía un formulario

onSubmit

Unload

Se descarga la página

onUnload

ESTRUCTURA DE UN HTML CON JAVASCRIPT
• Funciones JavaScript
– Dentro de un bloque <SCRIPT></SCRIPT>
– Dentro del <HEAD> del documento

• HTML no interactivo
– Dentro del <BODY> del documento

• HTML interactivo
– Atributos Gestores de Eventos cuyos valores son
funciones de JavaScript definidas en el bloque
<HEAD> del HTML

CLASES EN JAVASCRIPT
• Clases Predefinidas
– Clase String: Cada vez que se asigna una cadena
de caracteres a una variable, se crea un objeto de
la clase String
– Clase Math: Se usa para efectuar cálculos
matemáticos
– Clase Date: Para el manejo de fechas y horas

• Clases del Browser o Navegador
– Tienen que ver con la navegación

• Clases del Documento HTML
– Están asociadas con cualquier elemento de una
página Web (link, ancla, formulario, etc.)

• Clases definidas por el usuario

COMO SE USA
Las variables en JavaScript se definen usando la
palabra clave var
Un ejemplo sencillo:
A considerar los comentarios en el ejemplo de arriba, los cuales van precedidos con 2
barras diagonales.

¿CÓMO FUNCIONAN LOS CÓDIGOS?
Si sientes curiosidad por saber cómo funciona es sencillo:
─ El término "javascript" le indica al navegador que lo
que sigue es un código que debe ejecutar.
─ Alert() con esta función el navegador abre un cuadro de
aviso o mensaje que se muestra al usuario.
─ Si dentro del paréntesis no hay nada, el mensaje estará
en blanco. Si contiene texto lo mostrará (tiene que estar
encerrado entre comillas)
─ Si es una función la ejecutará. Para escribir el resultado
de una función es necesario anteponer el carácter +

EJEMPLOS
Los siguientes códigos demostrativos, cópialos y
pégalos en la barra de direcciones de tu
navegador y presiona la tecla Enter

javascript:alert('Hola esto es Javascript')
javascript:alert(''+document.title)
javascript:alert(''+location.href)

Javascript puede ser usada de diversas formas,
para crear efectos en las páginas, devolver
información, en formularios, etc.

FUENTES
• http://aprendeenlinea.udea.edu.co/lms/ova/
mod/resource/view.php?id=1598
• http://es.wikipedia.org/wiki/JavaScript#Sintaxi
s_y_sem.C3.A1ntica
• http://www.vc.ehu.es/jiwotvim/ISOFT20082009/Teoria/BloqueIV/JavaScript-tr.ppt

Universidad popular del cesar
NASER ROMERO DUARTE
INGENIERIA Y TECNOLOGIAS
TECNOLOGIA WEB
2013

JavaScript: lenguaje de programación para páginas web

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (10)

Similar to JavaScript: lenguaje de programación para páginas web

Similar to JavaScript: lenguaje de programación para páginas web (20)

Recently uploaded

Recently uploaded (20)

JavaScript: lenguaje de programación para páginas web