Scripting en el lado del Cliente
Diseño y Programación Web para Comercio Electrónico
Jimmy Villalobos Arias
[email protected]
A25460
Objetivos
 Definir
script del lado del cliente
 Mencionar el estándar ECMAScript
 Explicar el uso scripts en el lado del cliente
 Lenguajes de scripting del lado del cliente
 Ventajas
 Desventajas
 Ejemplos del uso de JavaScript
Lenguajes del lado del cliente
 Son
interpretados.
 Puede acompañar a un documento HTML o
puede estar incluido en él.
 Se ejecuta en la máquina del cliente.
 El soporte de scripts de HTML es
independiente del lenguaje de scripts.
Estándar ECMAScript
 ECMAScript
o ECMA-262 es una
especificación de lenguaje de programación
publicada por ECMA International. El
desarrollo empezó en 1996 y estuvo basado en el
popular lenguaje JavaScript propuesto como
estándar por Netscape Communications
Corporation. Actualmente está aceptado como
el estándar ISO 16262
Uso de scripting






Modificar los contenidos del documento
dinámicamente.
Procesar los datos que se introducen en un formulario.
Rellenar dinámicamente partes de un formulario según
los valores de los otros campos.
Asegurarse que los datos introducidos concuerden con
rangos de valores.
Pueden ser llamados por eventos que afecten al
documento.
Pueden ser vinculados a controles de formulario para
producir elementos gráficos.
Lenguajes
 Java
Script
 Visual Basic Script
 JScript
Ventajas
 Aplicaciones
de muy diversos tipo, desde
generadores de HTML, comprobadores de
formularios, etc.
 Desarrollar aplicaciones web que permitan crear
páginas como si fueran ventanas.
 Da la sensación de estar trabajando con una
aplicación con interfaz de ventanas.
Ventajas
 Páginas
dinámicas (DHTML)
 Comprobación de datos (Formularios)
 Uso de los elementos de la página web
 Intercambiar información entre páginas web en
distintas ventanas
 Manipulación de gráficos, texto, etc.
 Comunicación con plug-ins: Flash, Java,
Shockwave, etc.
Nuevas Capacidades
 DHTML,
los scripts en el lado del cliente
cambian el HTML del documento, lo cual afecta
la apariencia y las funciones de los objetos.
 AJAX es en donde se utiliza el objeto
XMLHttpRequest para intercambiar datos
asincrónicamente con el servidor web.
Ventajas

Es seguro y fiable hay que interpretarlo, por lo
que puede ser filtrado.

Se ejecuta en el cliente por lo que el servidor
no es solicitado más de lo debido.
Desventajas
 Dependiente
ejecutando
del sistema donde se están
Definicion de Javascript

Objetos

los objetos con los que trata JavaScript pueden ser
ventanas, formularios y elementos de formularios
(como botones, o las casillas de verificación).
Definicion de Javascript

Propiedades

Pueden modificar objetos y una misma propiedad se
puede aplicar a cualquier objeto ya sea igual o
diferente.
Definicion de Javascript

Métodos:

Son las acciones que pueden realizar los objetos.

Ejemplo:
Open();
Close();
Definicion de Javascript

Eventos:


Son acciones que el usuario realiza mientras mira la página,
Las etiquetas HTML tienen varios "eventos" que responden a
determinados sucesos
Por ejemplo: aparezca un mensaje al cargar la página:
<html>
<head>
</head>
<body onload="alert('Hola, esto es una página web')">
texto
</body>
</html>
Definicion de Javascript

Variables y Tipos de Datos:



Son espacios de memoria a los que se les asigna un nombre
de acceso.
Hay varios tipos de Datos: string, number, object, function,
array, boolean,
Ejemplo:
nombre = ”pedro”;
var value = 0;
Definicion de Javascript

Funciones:


conjunto de sentencias que realiza una tarea. tiene un
nombre.
Ejemplo:
Function decirAlgo() {
alert(“digo algo”);
}
Definicion de Javascript

Operadores:



los operadores sirven para introducir, evaluar, manipular y mostrar
información. Hay varios tipos de operadores.
Operador de asignación
 El operador de asignación en el lenguaje JavaScript es el símbolo
igual, =.
Operadores aritméticos
 Los aritméticos son los matemáticos: suma(+), resta(-),
multiplicación(*), división(/), y resto de división o módulo (%). El
operador + también puede ser utilizado para concatenar strings.
Definicion de Javascript

Estructuras de Control:



indican condición.
permiten modificar el flujo de
ejecución de las instrucciones de un
programa.
Ejemplo:
if (condición) {
[Sentencias]
}
if (condición) {
[Sentencias]
}else{
[Sentencias]
}

Ejemplo:
switch( ''expresión'' ){
case ''valorX'' :
''sentencias'';
break;
case ''valorX'' :
''sentencias'';
break;
...
default :
''sentencias'';
break;
}
Definicion de Javascript

Bucles:

Un bucle permite realizar una acción un
determinado número de veces. En JavaScript hay
varios tipos de bucles:
 For
 While
 Do while
 For in
Ejemplos del uso de JavaScript
Clon del clásico Arkanoid
 http://www.pixelinstrument.net/portfolio/ourdemo
s/arkanoid.php
 Juego en primera persona
 http://www.abrahamjoffe.com.au/ben/canvascape/

Muchas Gracias
Descargar

Maestría en Computación e Informática Jimmy Villalobos