Está en la página 1de 35

Javascript

CI-2413 Desarrollo de
aplicaciones para Internet
Versiones de Javascript
 NN 2.0 / IE 3.0 (Con errores y poco
confiable)
 Javascript 1.0
 NN 3.0
 Javascript 1.1
 NN 4.0 / IE 4.0
 Javascript 1.2 (En IE conocido como JScript)
 NN 6.0 / IE 6.0
 Javascript 1.5
Agregando el código al HTML
 Ejemplo:
 <script language="Javascript">
<!--
document.write("¡Hola mundo!");
// -->
</script>
 Ejemplo:
 <script language="Javascript1.2">
Agregando el código al HTML
 Ejemplo:
 <script language="JavaScript"
src="functions.js"></script>
 La última norma de HTML disponible en
http://www.w3.org/TR/html401/interact/scripts
.html
recomiendo utilizar:
 <script type="text/javascript"></script>
Agregando el código al XHTML
 Ejemplo:
 <script type="text/javascript">
//<![CDATA[

alert("<Esto es compatible con XHTML>");

//]]>
</script>
Gramática
 Elementos:
 Variables
 Operadores
 Expresiones
 Declaraciones
 Objetos
 Los objetos son muy importantes, porque gracias a unos
objetos predefinidos del lenguaje podemos acceder a las
diferentes características de una página HTML. Esto se
llama "Document Object Model".
 Funciones y métodos
Variables y tipos de datos
 Se crea una variable global nueva simplemente
asignando un valor:
 nuevaVariable = 5;
 Sin embargo, dentro de las funciones si se desea
una variable con alcance local se utiliza var:
 function nuevaFuncion()
{
var ciclo=1;
total=0;
}
Variables y tipos de datos
 Javascript no tiene chequeo fuerte de tipo.
 Tipos
 Números
 Booleanos
 Hileras
 Objetos
 Nulo
 Indefinido
 Los operadores pueden comportarse diferente
dependiendo del tipo.
Operadores
 Aritméticos
 + Adición
 - Sustracción
 * Multiplicación
 % Módulo
 ++ Incremento unario
 -- Decremento unario
 - Negación unaria: devuelve la negación del operando.
Operadores
 Comparación
 == Igual a
 != Diferente
 > Mayor que
 >= Mayor o igual que
 < Menor que
 <= Menor o igual que
Operadores
 Booleanos
 && Y
 || O
 ! No
 Hileras
 + Concatenación
Operadores
 Asignación
 =
 +=,-=,*=,/=
 &=,|=
 Especiales
 (condición) ? valorSi : valorNo
 typeof Devuelve el tipo.
 Expresiones regulares (JavaScript 1.2)
Estructuras de control
 if ... else
 if (condición)
{
declaraciones1;
}
else
{
declaraciones2;
}
Estructuras de control
 switch
 switch (expresión) {
case valor :
declaración;
break;
case valor :
declaración;
break;
...
default : declaración;
}
Estructuras de control
 for
 for (declaraciónInicial; prueba; incremento)
{
declaraciones;
}
Estructuras de control
 do ... while
 do
{
declaraciones;
}
while (condición);
Estructuras de control
 while
 while (condición)
{
declaraciones;
}
Estructuras de control
 break y continue funcionan para JavaScript
como en otros lenguajes.

 for in
 for (variable in objeto)
{
declaraciones;
}
Estructuras de control
 with
 with (objeto)
{
declaraciones;
}
Comentarios
 Se pueden utilizar comentarios de una línea
o de varias:
 // comentario de una línea
 /* comentario que permite
escribir en varias
líneas */
Funciones
 Sintaxis
 function nombre(arg1,arg2,...)
{
statements;
}
 Se recomienda escribir las funciones en el
encabezado HTML (<head></head>), ya que este
se carga antes del resto del documento.
Objetos
 Document Object Model
 Es un modelo de objetos predefinidos. Esta
jerarquía de objetos depende del navegador.
Objetos
 Propiedades:
 carro.fabricante = "Toyota"
carro.modelo = "Camry"
carro.anyo = "1990"
document.write(carro.anyo);
 O:
 carro['fabricante'] = "Toyota"
carro['modelo'] = "Camry"
carro['anyo'] = "1990"
document.write(carro['anyo']);
Objetos
 Métodos:
 window.close();
 Creación:
 miPerro = new Object();
miPerro.nombre = "Scooby Doo";
 Asignación de métodos:
 miPerro.Huir = Huir;
Objetos
 Constructor:
 function Perro(nombre) {
this.nombre = nombre;
}

miPerro = new Perro("Scooby Doo");


Eventos
 Para ver los posibles eventos de cada
etiqueta HTML ver http://w3.org/TR/html401.
 Para cada navegador en el sitio web del
fabricante se pueden encontrar los eventos
disponibles.
 Sintaxis básica:
 <etiqueta atributo1 atributo2
onNombreEvento="código javascript;">
Excepciones
Excepciones
 Ejemplo:
 try {
ejecute este bloque
}
catch (error) {
ejecute este bloque si hay error
}
Excepciones
 Ejemplo:
 try {
colores[2] = "rojo";
}
catch (e) {
if (e instanceof TypeError)
{
alert(“Variable errónea o indefinida…");
}
}
Excepciones
 Tipos de excepciones:
 EvalError – Se alcanza cuando la función eval() es
utilizada en una manera incorrecta;
 RangeError – Se alcanza cuando una variable numérica
sobrepasa su valor máximo;
 ReferenceError – Se alcanza cuando se utiliza una
referencia inválida;
 SyntaxError – Se alcanza cuando un error de sintáxis
ocurre mientras se parsea código JavaScript;
 TypeError – Se alcanza cuando el tipo de una variable no
es el que se esperaba;
 URIError – Se alcanza cuando las funciones encodeURI()
o decodeURI() son utilizadas de una manera incorrecta;
Excepciones
 Ejemplo:
 try {
colores[2] = "rojo";
}
catch (e) {
alert(“Ocurrió un error. Nombre: " + e.name + ".
Mensaje: " + e.message);
}
Excepciones (finally)
 Ejemplo:
 try {
ejecute este bloque
}
catch (error) {
ejecute este bloque si hay error
}
finally {
ejecute este bloque siempre
}
Excepciones (throw)
 Ejemplo:
 if (document.forms[0].edad.valor > 99)
{
throw RangeError;
}
Excepciones: (Error)
 Ejemplo:
 ErrorNombre = new Error (“El nombre de usuario
del sistema no empareja con el usuario real.");

 throw ErrorNombre;
Lecturas recomendadas
 Norma ECMA Script
 Netscape's JavaScript Guide
 Netscape's JavaScript Documentation Library
 Microsoft JScript Documentation
 Microsoft Scripting TechnologiesM
 Microsoft DHTML References
 Microsoft DHTML Object Model

También podría gustarte