Continuación JS

1. JavaScript

2. Contenido
• Versiones.
• Repaso: Case Sensitivity. WhiteSpace & LineBreaks.
Optional semicolons. Comments. Literales.
Identificadores Variables. Variable Scope. Palabras
reservadas. Operadores. Void. Try Catch Finally.
With. Objects. Arrays. Eventos, Input, Objects: DOM.
• Ejercicios-ejemplos.

3. JavaScript
• JavaScript:
Es un lenguaje imperativo, estructurado e
interpretado con capacidad de implementar
objetos (Orientado a Objetos).

4. JavaScript – Historia
• Creado (1995) como Mocha por NetScape (Brendan
Eich).
• Mocha -> LiveScript -> JavaScript.
• 1995 Netscape 2.0 incorpora soporte Java y renombra
LiveScript a JavaScript (objetivo comercial).
• Microsoft JScript. IE 1996. IE 3.0.
• W3C: DOM – Especificación JavaScript.
• IE 6.0 – NetScape – Opera v7 – Mozilla v1.
• 1997 JavaScript como standard de ECMA: ECMAScript.
• JavaScript: marca registrada por Oracle.

5. JavaScript - Actores

6. JavaScript Versiones
• JavaScript se encuentra oficialmente bajo la
organización Mozilla Foundation
• El último standard de ECMA es el ECMA-262
de Junio de 2011.
• La última versión del lenguaje JavaScript 1.8.5
del año 2011.
• Nuevas características del lenguaje son
añadidas periódicamente.

7. Repasando
• Case Sensitive
Palabras reservadas en minúsculas siempre.
Online ONLINE online onLine 4 variables distintas
HTML no es CS valores atributos pueden
confundirnos: onClick()

8. Repasando
• Espacios y saltos de línea
JavaScript ignora espacios, tabulaciones y
saltos de línea entre tokens del lenguaje.
Una sola restricción: punto y coma.

9. Repasando
• Separar instrucciones: punto y coma.
Opcional pero la siguiente instrucción debe
seguir en la siguiente línea (salto línea
obligatorio)

10. Repasando
• Comentarios
// comentario para una sola línea
/* Comentario
* para
*
* varias líneas
*/

11. Repasando
• Literal: un valor
12 // número doce
1.2 // número
“hola” //string
‘hola’ //string
true // booleano
/javascript/gi //expresión regular
null // objeto ausencia

12. Repasando
• Identificadores para variables/funciones/label
Los identificadores se utilizan para dar nombre a
variables, funciones y etiquetas.
El primer carácter debe ser una letra, un guión bajo o
el signo $ y a continuación cualquier combinación de
estos más números.
No pueden ser palabras reservadas.

13. Repasando
• Variables
Se declaran con var
Múltiple declaración en una misma línea separar
con comas: var a, b=0, c=1;
Scope: alcance de definición de la variable.

14. Variables Scope
• Las variables son válidas dentro del módulo
donde se las declara.
• Una variable global tiene scope global, puede
estar definida en cualquier lugar dentro del
script.
• Las variables locales son las definidas dentro
de funciones. Tienen scope (local) dentro de la
misma función.

15. Variable Scope
var scope = “global”; //Define una variable global
function checkscope() {
var scope = “local”; //Define una local
document.write(scope); //Usa la variable local
}
checkscope(); //Imprime “local”

16. Variable Scope
Se puede omitir var y definir una variable
globalemente:
scope = “global”;
Pero las variables locales deben definirse
siempre con var

17. Variable Scope
scope = “global”; //Define una variable global
function checkscope() {
scope = “local”; //Cambia el valor de la global
document.write(scope); //Utiliza la variable global
myscope = “local”; //Define variable global
document.write(myscope); //Usa la variable global
}
checkscope(); //Imprime “locallocal”
document.write(scope); //Imprime “local”
document.write(myscope); //Imprime “local”

18. Variable Scope
• Los parámetros de funciones son variables
locales.
• Las funciones no saben que variables están
definidas como globales: definir todas con var
• Precedencia de Variables:
– Las variables locales preceden a las globales.

19. Variable Scope
var scope = “global”; // variable global
function checkscope() {
var scope = “local”; // variable local
function nested() {
var scope = “nested”; // variable local (otra)
document.write(scope); // “nested”
}
nested();
}
checkscope();

20. Variable Scope
No hay scope en bloque: todas las variables definidas
dentro de una función, no importa donde estén
declaradas, tienen alcance dentro de la función.
function test(o) {
var i=0;
if (typeof o == ‘object’) {
var j=0;
for (var k=0; k<10; k++) {
document.write(k); // 0,1,…,9
}
document.write(k); // 10
}
document.write(j); // 0 o undefined
}

21. Variable Scope
var scope = “global”;
function f() {
alert(scope); // undefined
var scope = “local”;
alert(scope); // local
}
f();

22. Undefined
Existen 2 tipos de variables “undefined”
Undefined porque no tienen valor asignado
Undefined porque no han sido aún definidas,
estas incurren en runtime error
var x; // está definida pero sin valor
alert(x); // undefined
alert(u); // Uncaught ReferenceError: u is not defined

23. Null
• Null es un valor especial que indica “sin valor”.
 Cuando una variable contiene el valor “null” significa que
la misma no contiene un valor válido para un objeto, array,
número, cadena o lógico.
 En un contexto boolean, null se trata como false.
 En un contexto numérico, null se trata como 0.
 En un contexto string, null se trata como “null”.

24. Conversión de Tipos
Contexto String Number Boolean Object
Valor
undefined “undefined” NaN false Error
null “null” 0 false Error
Cadena Cadena “numero” / NaN true Objeto cadena
Cadena vacía Cadena 0 false Objeto cadena
0 “0” Número false Objeto número
NaN “NaN” NaN false Objeto número

25. Palabras Reservadas
break do if switch typeof
case else in this var
catch false instanceof throw void
continue finally new true while
default for null try with
delete function return

26. Operadores typeof
• typeof: es un operador unario que determina
el tipo de operando.
– Evalúa a: number, string y boolean.
– Evalúa a object para arreglos, objetos y null.
– Evalúa a function para funciones.
– Evalúa a undefined operandos indefinidos.

27. Operadores instanceof
• instanceof: determina si un objeto es una
instancia de una clase.
– d instanceof Date(); // true si d tipo Date.
– a instanceof Array; // true si a es un arreglo.
– a instanceof Object; // true si a es un arreglo.

28. Continuará…
• Void.
• Try Catch Finally.
• With.
• Arreglos & Objetos.
• Manejo HTML DOM.
• Manejo HTML input.
• Manejo HTML Eventos.
• Manejo HTML Objetos.

29. Void
• Operador unario
• Descarta el tipo de su operando y devuelve
undefined.
Usos
- forzar el valor undefined
- <a href="javascript:void window.open();">Open window</a>

30. throw
Se utiliza para lanzar un error.
Un error que deba ser atrapado
específicamente.
Es una señal de que una condición excepcional
ha ocurrido.
throw new Error(‘Houston we have…’);

31. try catch finally
Try {
// sentencias [1]
}
catch(e){
// si error en [1]
}
finally{
// ejecución normal [1]
// break/continue/return [1]
// error capturado en catch
// error no capturado en [1]
// error no capturado en catch
}

32. With
• Se utiliza para alterar la cadena del scope en
variables:
– document.images[0].src = “imagen_1.jpg”;
– document.images[0].width = 110;
– document.images[0].height = 230;
with (document.images[0]) {
src = “imagen_1.jpg”;
width = 110;
height = 230;
}