Post on 05-Mar-2015
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