Unidades Enfoque Orientado a Competencias
¿Quieres reaccionar a este mensaje? Regístrate en el foro con unos pocos clics o inicia sesión para continuar.

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

+5
thanahi
CINTHIA CADENA PEREZ
sinay vargas
ISAI RENDON QUITERIO1
Admin
9 participantes

Página 1 de 2. 1, 2  Siguiente

Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por Admin Dom Abr 06, 2014 7:58 pm

Haciendo uso de libros, artículos
científicos, o entrevistas o visitas a
empresas que trabajen con
aspectos relacionados a la materia,
o usando Internet mediante foros,
wikis, blogs, webquest, o algunas
otras TICs, o utilizando contenidos
de proyectos similares de la
carrera, el estudiante debe
investigar al menos dos de los
siguientes temas:
- Conceptos básicos de RIA (Rich
Internet Applications) /
- JavaScript Básico (conceptos,
temas que refieren al nivel básico y
ejemplo de programa) /
- JavaScript Avanzado (conceptos,
temas que refieren al nivel
avanzado y ejemplo de
programa) /
- Definición y un ejemplo de
programa usando DOM (Document
Object Model) /
- Definición y un ejemplo de
programa usando BOM (Browser
Object Model) /
- Manejo de Eventos Java Script
(conceptos o descripción de los
más comunes y un ejemplo de
programa) /
- Manejo del Objeto
XMLHttpRequest y ActiveXObject
(conceptos o descripción de
funciones y un ejemplo de
programa) /
- Frameworks y librerías utilizadas
para desarrollo de RIA (describa
varias) /
- Explicar la forma sobre cómo se
trabaja con herramientas de
desarrollo Web para crear
aplicaciones interactivas o RIA
(Rich Internet Applications) e
investigar los componentes de
dicha técnica....
/////////////////// Cada uno
de los temas deben comprender
conceptos y elementos básicos de
los lenguajes y metodologías que
involucra el desarrollo de
aplicaciones Web.
El objetivo de esta actividad es
propiciar al estudiante actividades
de búsqueda, comunicación oral y
escrita, capacidad crítica y
autocrítica, selección y clasificación
y análisis de información
proveniente de distintas fuentes y
propiciar el uso de las nuevas
tecnologías en el desarrollo de los
contenidos de la asignatura, las
cuales lo encaminen hacia la
aplicación de conocimientos y la
solución de problemas y desarrollar
habilidades para la investigación.
Por ello, procure llevar a cabo un
buen análisis de la información de
distintas fuentes (incluyendo un
segundo idioma y uso adecuado
de conceptos y terminología
científico–tecnológica) para
seleccionar la más conveniente y
que sea adecuada al área de
informática. Debe elaborar un
resumen o análisis o síntesis o
reflexión o tabla comparativa o
cuadro sinóptico (estilo inducción-
deducción) o mapa conceptual o
mapa mental, que permitan
promover el pensamiento crítico o
posición critica del estudiante, el
cual debe compartir en este Foro.
/////////// NOTA: Procure
participar con reactivos que aún no
hayan sido contestados, ya que
solamente se considerarán las
primeras tres participaciones para
cada tema.
Atte: M.C. Edgar Rangel Lugo .

Admin
Admin

Mensajes : 349
Fecha de inscripción : 14/03/2012

https://erangel.foroactivo.mx

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA A LA PREGUNTA N°1

Mensaje por ISAI RENDON QUITERIO1 Miér Abr 09, 2014 10:31 pm

1.- CONCEPTOS BÁSICOS DE RIA (RICH INTERNET APPLICATIONS)
Las rich Internet applications, o RIA (en español "aplicaciones de Internet enriquecidas"), son aplicaciones web que tienen la mayoría de las características de las aplicaciones de escritorio tradicionales. Estas aplicaciones utilizan un navegador web estandarizado para ejecutarse y por medio de complementos o mediante una máquina virtual se agregan las características adicionales.
Las RIA son aplicaciones web con características de interfaz de usuario similares a las aplicaciones de escritorio.
Las RIA surgen como una combinación de las ventajas que ofrecen las aplicaciones web y las aplicaciones tradicionales.
Buscan mejorar la experiencia y productividad del usuario.


CARACTERÍSTICAS:
 Accesibilidad: AJAX en nativo en los navegadores web y es el único RIA framework que puede ser encontrado por los diferentes motores de búsqueda. Aunque Adobe Flash ha dado grandes pasos en esta dirección.
 Comunicaciones avanzadas: con servidores que soporten nuevas tecnologías se puede mejorar la experiencia del usuario al utilizar protocolos de red optimizados y entradas y salidas asíncronas. Se requiere de una conexión de banda ancha confiable.
 Complejidad: soluciones avanzadas puede ser más difíciles de diseñar, desarrollar, implementar y depurar que las aplicaciones web tradicionales.
 Consistencia: la interfaz de usuario y las experiencias pueden ser controlada por el sistema operativo, el monitoreo del rendimiento y diagnóstico de errores puede ser difícil.
 Instalación y mantenimiento: se requiere de la instalación de un plugin o una máquina virtual o sandbox, que generalmente es más rápida que la instalación de una aplicación tradicional y esta no se puede automatizar. Las actualizaciones son automáticas.
 Seguridad: se mejora la seguridad por medio de actualizaciones automáticas y sandbox. Pero las extensiones por sí mismas son sujetas a vulnerabilidades.
 Rendimiento: puede ser mejorado dependiendo de la aplicación y de las características de la red. Aplicaciones que pueden procesar localmente en el cliente evitan viajes hacia el servidor lo que incrementa su rendimiento. Dándole más trabajo al cliente también se puede incrementar el rendimiento del servidor. Por el contrario los recursos necesarios hacen difícil que las aplicaciones puedan ejecutarse en dispositivos pequeños, móviles o embebidos.
 Riqueza: añadiendo características que no son nativas en los navegadores web como captura de video.

PLATAFORMAS RIA
 AJAX
 Adobe Flash
 Adobe Flex
 Adobe AIR
 Silverlight
 JavaFX Script
 OpenLaszlo
 Bindows
 GWT
 ZK
 JavascriptMVC
 Javascript


VENTAJAS DE RIA
Ventajas respecto a aplicaciones de escritorio:
 Único punto de instalación y mantenimiento en el servidor web
 Los clientes no requieren de ninguna instalación
 Clientes siempre actualizados a la última versión, disponible en el servidor web
 Multiplataforma, accesible desde Windows, Linux, Mac OS

Ventajas respecto a aplicaciones web:
 Experiencia de usuario similar a aplicaciones de escritorio
 Desaparece problemática de incompatibilidad entre navegadores
 Reducción de carga del servidor al estar la capa de presentación en el cliente
 Potencia en Streaming de video


INCONVENIENTES
 Necesidad de instalar Plug-ins
 Necesidad de disponer de mayor potencia en los dispositivos cliente
 Riesgo de sobrecarga la interfaz de usuario por querer explotar las posibilidades de RIA
 Falta de profesionales con experiencia en RIA
 Problemas relativos a la accesibilidad de la aplicación
 Botones de atrás y refrescar


ARQUITECTURA
[img]3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) F58650[/img]


BENEFICIOS:
A pesar de que el desarrollo de aplicaciones multimedia para navegadores web está mucho más limitado y es más difícil que otro tipo de aplicaciones de escritorio, los esfuerzos se justifican por varios motivos:
 No necesitan instalación (solo es necesario mantener actualizado el navegador web).
 Las actualizaciones hacia nuevas versiones son automáticas.
 Se pueden utilizar desde cualquier ordenador con una conexión a Internet sin depender del sistema operativo que este utilice.
 Generalmente es menos probable la infección por virus, que utilizando por ejemplo programas ejecutables.
 Más capacidad de respuesta, ya que el usuario interactúa directamente con el servidor, sin necesidad de recargar la página.
 Ofrecen aplicaciones interactivas que no se pueden obtener utilizando solo HTML, incluyendo arrastrar y pegar, cálculos en el lado del cliente sin la necesidad de enviar la información al servidor.
 Evita la problemática del uso de diferentes navegadores al abstraerse de ellos a través de un framework.


FUENTES DE INFORMACIÓN
http://blog.portalsaas.com/que-es-ria-rich-internet-applications/
http://es.wikipedia.org/wiki/Rich_Internet_Applications
http://exa.unne.edu.ar/depar/areas/informatica/SistemasOperativos/TFLino.pdf
http://www.slideshare.net/lisepi09/rich-internet-applications-2615942



INTEGRANTES DEL EQUIPO:
ANGON TORRES MOISES
DELGADO GOMEZ PABLO
RENDON QUITERIO ISAI
TORRES LEON MIGUEL ANGEL
VALENCIA DOMINGUEZ ROMUALDO


Última edición por ISAI RENDON QUITERIO1 el Dom Abr 13, 2014 9:50 pm, editado 3 veces
ISAI RENDON QUITERIO1
ISAI RENDON QUITERIO1

Mensajes : 87
Fecha de inscripción : 29/01/2013
Edad : 32

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA A LA PREGUNTA N°4

Mensaje por ISAI RENDON QUITERIO1 Miér Abr 09, 2014 10:33 pm

4.- DEFINICIÓN Y UN EJEMPLO DE PROGRAMA USANDO DOM (DOCUMENT OBJECT MODEL)

¿QUÉ ES DOM?
El Modelo de Objetos del Documento (DOM) es una interfaz de programación de aplicaciones (API) para documentos HTML.
Define la estructura lógica de los documentos y el modo cómo se accede y manipula un documento.
Con el Modelo de Objetos del Documento, los programadores pueden construir documentos, navegar por su estructura y añadir, modificar o eliminar elementos y contenidos.
Se puede acceder a cualquier cosa que se encuentre en un documento HTML o XML, y se puede modificar, eliminar o añadir usando el Modelo de Objetos del Documento, salvo algunas excepciones.
El Document Object Model o DOM es un modelo estándar sobre cómo pueden combinarse dichos objetos, y una interfaz estándar para acceder a ellos y manipularlos.
A través del DOM, los programas pueden acceder y modificar el contenido, estructura y estilo de los documentos HTML y XML, que es para lo que se diseñó principalmente.
El Modelo de Objetos del Documento (DOM) permite ver el mismo documento de otra manera, describiendo el contenido del documento como un conjunto de objetos que un programa JavaScript puede actuar sobre ellos.
El DOM permite un acceso a la estructura de una página HTML mediante el mapeo de los elementos de esta página en un árbol de nodos. Cada elemento se convierte en un nodo y cada porción de texto en un nodo de texto.


EJEMPLO DE PROGRAMA USANDO DOM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejercicio 13 - DOM básico y atributos XHTML</title>
<script type="text/javascript">
function anade() {
 var elemento = document.createElement("li");
 var texto = document.createTextNode("Exitoso");
 elemento.appendChild(texto);
 var lista = document.getElementById("lista");
 lista.appendChild(elemento);
 var nuevoElemento = "<li>Texto de prueba</li>";
 lista.innerHTML = lista.innerHTML + nuevoElemento;
}
</script>
</head>
<body>
<ul id="lista">
 <li>Isai</li>
 <li>Rendon</li>
 <li>Quiterio</li>
 <li>Ing.informatica</li>
</ul>
<input type="button" value="Añadir elemento" onclick="anade();">
</body>
</html>


FUENTES DE INFORMACIÓN:
http://aprendeenlinea.udea.edu.co/lms/ova/mod/resource/view.php?id=1634
http://es.wikipedia.org/wiki/Document_Object_Model
http://html.conclase.net/w3c/dom1-es/introduction.html
https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Ejemplos
http://www.desarrolloweb.com/articulos/que-es-el-dom.html


INTEGRANTES DEL EQUIPO:
ANGON TORRES MOISES
DELGADO GOMEZ PABLO
RENDON QUITERIO ISAI
TORRES LEON MIGUEL ANGEL
VALENCIA DOMINGUEZ ROMUALDO


Última edición por ISAI RENDON QUITERIO1 el Dom Abr 13, 2014 9:53 pm, editado 1 vez
ISAI RENDON QUITERIO1
ISAI RENDON QUITERIO1

Mensajes : 87
Fecha de inscripción : 29/01/2013
Edad : 32

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA A LA PREGUNTA N°5

Mensaje por ISAI RENDON QUITERIO1 Miér Abr 09, 2014 10:35 pm

5.- DEFINICIÓN Y UN EJEMPLO DE PROGRAMA USANDO BOM (BROWSER OBJECT MODEL)

¿QUÉ ES BOM?
BOM, permite acceder y modificar las propiedades de las ventanas del propio navegador.
Mediante BOM, es posible redimensionar y mover la ventana del navegador, modificar el texto que se muestra en la barra de estado y realizar muchas otras manipulaciones no relacionadas con el contenido de la página HTML.
El mayor inconveniente de BOM es que, al contrario de lo que sucede con DOM, ninguna entidad se encarga de estandarizarlo o definir unos mínimos de interoperabilidad entre navegadores.
Algunos de los elementos que forman el BOM son los siguientes:
 Crear, mover, redimensionar y cerrar ventanas de navegador.
 Obtener información sobre el propio navegador.
 Propiedades de la página actual y de la pantalla del usuario.
 Gestión de cookies.
 Objetos ActiveX en Internet Explorer.
El BOM está compuesto por varios objetos relacionados entre sí.
El objeto window representa la ventana completa del navegador. Mediante este objeto, es posible mover, redimensionar y manipular la ventana actual del navegador. Incluso es posible abrir y cerrar nuevas ventanas de navegador.
Como todos los demás objetos heredan directa o indirectamente del objeto window, no es necesario indicarlo de forma explícita en el código JavaScript. En otras palabras:
window.forms[0] === forms[0]
window.document === document

No existen normas oficiales para el Browser Object Model o (BOM).
Dado que los navegadores modernos han puesto en práctica (casi) los mismos métodos y propiedades para la interactividad con JavaScript, se refieren a menudo como los métodos y las propiedades de la lista de materiales.
La ventana de objeto es compatible con todos los navegadores. Se representa la ventana del navegador.
Todos los objetos globales de JavaScript, las funciones y las variables se convierten automáticamente en miembros del objeto ventana.
Las variables globales son propiedades del objeto ventana.
Funciones globales son métodos del objeto window.


EJEMPLO DE PROGRAMA USANDO BOM
<HTML>
<HEAD>
<TITLE>Abriendo y cerrando ventanas con Javascript</TITLE>
<SCRIPT>
<!--
var nuevaVentana;

function doble( x ) {
 return 2*x;
}
function  nueva() {
 nuevaVentana=nuevaVentana=window.open("", "segundaPag",
 "toolbar=yes,location=no,menubar=yes,resizable=yes,"+
 "width=30,height=30" );
 nuevaVentana.document.write("<HTML><HEAD><TITLE>"+
 "Sin Título</TITLE></HEAD>\n");
 nuevaVentana.document.write("<BODY><form>\n");
 nuevaVentana.document.write("<input type='button' "+
 "value='Cerrar' onClick='window.close();'>\n");
 nuevaVentana.document.write("</form>\n");
 nuevaVentana.document.write("</BODY></HTML>\n");
 nuevaVentana.document.close();
}
// -->
</SCRIPT>
<BODY>
<FORM>
 <INPUT TYPE="button" VALUE="Abrir" onClick="nueva();"><br>
</FORM>
</BODY>
</HTML>



FUENTES DE INFORMACIÓN:
http://www.arkaitzgarro.com/javascript/capitulo-14.html
http://www.w3schools.com/js/js_window.asp
http://geneura.ugr.es/~victor/cursillos/javascript/js_window.html


INTEGRANTES DEL EQUIPO:
ANGON TORRES MOISES
DELGADO GOMEZ PABLO
RENDON QUITERIO ISAI
TORRES LEON MIGUEL ANGEL
VALENCIA DOMINGUEZ ROMUALDO
ISAI RENDON QUITERIO1
ISAI RENDON QUITERIO1

Mensajes : 87
Fecha de inscripción : 29/01/2013
Edad : 32

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL INCISO # 2

Mensaje por sinay vargas Lun Abr 21, 2014 10:26 pm

JavaScript Básico (conceptos, temas que refieren al nivel básico y ejemplo de programa)

JAVASCRIPT
JavaScript es un lenguaje de programación utilizado para crear pequeños programas encargados de realizar acciones dentro del ámbito de una página web.
Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Con Javascript se puede crear efectos especiales en las páginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso, y tal vez el único, con que cuenta este lenguaje es el propio navegador.
En JavaScript básico se pueden encontrar los siguientes elementos:

 Variables
 Tipos de Variables
 Operadores
 Estructuras de control de flujo


Variables
Las variables en los lenguajes de programación siguen una lógica similar a las variables utilizadas en otros ámbitos como las matemáticas. Una variable es un elemento que se emplea para almacenar y hacer referencia a otro valor. Gracias a las variables es posible crear "programas genéricos", es decir, programas que funcionan siempre igual independientemente de los valores concretos utilizados.
Las variables en JavaScript se crean mediante la palabra reservada var. De esta forma, el ejemplo anterior se puede realizar en JavaScript de la siguiente manera:
var numero_1 = 3;
var numero_2 = 1;
var resultado = numero_1 + numero_2;


Tipos de Variables
Aunque todas las variables de JavaScript se crean de la misma forma (mediante la palabra reservada var), la forma en la que se les asigna un valor depende del tipo de valor que se quiere almacenar (números, textos, etc.)

Numéricas

Se utilizan para almacenar valores numéricos enteros (llamados integer en inglés) o decimales (llamados floaten inglés). En este caso, el valor se asigna indicando directamente el número entero o decimal. Los números decimales utilizan el carácter . (punto) en vez de , (coma) para separar la parte entera y la parte decimal:
var iva = 16;        // variable tipo entero
var total = 234.65;  // variable tipo decimal


Cadenas de texto

Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la variable, se encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final:
var mensaje = "Bienvenido a nuestro sitio web";
var nombreProducto = 'Producto ABC';
var letraSeleccionada = 'c';
En ocasiones, el texto que se almacena en las variables no es tan sencillo. Si por ejemplo el propio texto contiene comillas simples o dobles, la estrategia que se sigue es la de encerrar el texto con las comillas (simples o dobles) que no utilice el texto:
/* El contenido de texto1 tiene comillas simples, por lo que
   se encierra con comillas dobles */
var texto1 = "Una frase con 'comillas simples' dentro";

/* El contenido de texto2 tiene comillas dobles, por lo que
   se encierra con comillas simples */
var texto2 = 'Una frase con "comillas dobles" dentro';


Arrays

En ocasiones, a los arrays se les llama vectores, matrices e incluso arreglos. No obstante, el término array es el más utilizado y es una palabra comúnmente aceptada en el entorno de la programación.
Un array es una colección de variables, que pueden ser todas del mismo tipo o cada una de un tipo diferente. Su utilidad se comprende mejor con un ejemplo sencillo: si una aplicación necesita manejar los días de la semana, se podrían crear siete variables de tipo texto:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
Ahora, una única variable llamada dias almacena todos los valores relacionados entre sí, en este caso los días de la semana.


Booleanos
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo lógico. Aunque para entender realmente su utilidad se debe estudiar la programación avanzada con JavaScript del siguiente capítulo, su funcionamiento básico es muy sencillo.
Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true(verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto.
Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden utilizarse los valores verdadero y falso. A continuación se muestra un par de variables de tipo booleano:
var clienteRegistrado = false;
var ivaIncluido = true;



Operadores
Los operadores permiten manipular el valor de las variables, realizar operaciones matemáticas con sus valores y comparar diferentes variables. De esta forma, los operadores permiten a los programas realizar cálculos complejos y tomar decisiones lógicas en función de comparaciones y otros tipos de condiciones.




ASIGNACIÓN


El operador de asignación es el más utilizado y el más sencillo. Este operador se utiliza para guardar un valor específico en una variable. El símbolo utilizado es = (no confundir con el operador == que se verá más adelante):
var numero1 = 3;



Incremento y decremento


Estos dos operadores solamente son válidos para las variables numéricas y se utilizan para incrementar o decremento en una unidad el valor de una variable.
Ejemplo:
var numero = 5;
++numero;
alert(numero);  // numero = 6
El operador de incremento se indica mediante el prefijo ++ en el nombre de la variable. El resultado es que el valor de esa variable se incrementa en una unidad. Por tanto, el anterior ejemplo es equivalente a:
var numero = 5;
numero = numero + 1;
alert(numero);  // numero = 6



LÓGICOS

Los operadores lógicos son imprescindibles para realizar aplicaciones complejas, ya que se utilizan para tomar decisiones sobre las instrucciones que debería ejecutar el programa en función de ciertas condiciones.
El resultado de cualquier operación que utilice operadores lógicos siempre es un valor lógico o booleano.


NEGACIÓN

Uno de los operadores lógicos más utilizados es el de la negación. Se utiliza para obtener el valor contrario al valor de la variable:
var visible = true;
alert(!visible);  // Muestra "false" y no "true"


Estructuras de control de flujo
Las estructuras de control de flujo, que son instrucciones del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro". También existen instrucciones del tipo "repite esto mientras se cumpla esta condición".
Si se utilizan estructuras de control de flujo, los programas dejan de ser una sucesión lineal de instrucciones para convertirse en programas inteligentes que pueden tomar decisiones en función del valor de las variables.


Estructura if
La estructura más utilizada en JavaScript y en la mayoría de lenguajes de programación es la estructura if. Se emplea para tomar decisiones en función de una condición. Su definición formal es:
if(condicion) {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro de {...}. Si la condición no se cumple (es decir, si su valor es false) no se ejecuta ninguna instrucción contenida en {...} y el programa continúa ejecutando el resto de instrucciones del script.
Ejemplo:
var mostrarMensaje = true;

if(mostrarMensaje) {
 alert("Hola Mundo");
}
Estructura if...else
En ocasiones, las decisiones que se deben realizar no son del tipo "si se cumple la condición, hazlo; si no se cumple, no hagas nada". Normalmente las condiciones suelen ser del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro".
Para este segundo tipo de decisiones, existe una variante de la estructura if llamada if...else. Su definición formal es la siguiente:
if(condicion) {
 ...
}
else {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro del if(). Si la condición no se cumple (es decir, si su valor es false) se ejecutan todas las instrucciones contenidas en else { }. Ejemplo:
var edad = 18;

if(edad >= 18) {
 alert("Eres mayor de edad");
}
else {
 alert("Todavía eres menor de edad");
}
Si el valor de la variable edad es mayor o igual que el valor numérico 18, la condición del if() se cumple y por tanto, se ejecutan sus instrucciones y se muestra el mensaje "Eres mayor de edad". Sin embargo, cuando el valor de la variable edad no es igual o mayor que 18, la condición del if() no se cumple, por lo que automáticamente se ejecutan todas las instrucciones del bloque else { }. En este caso, se mostraría el mensaje "Todavía eres menor de edad".
El siguiente ejemplo compara variables de tipo cadena de texto:
var nombre = "";

if(nombre == "") {
 alert("Aún no nos has dicho tu nombre");
}
else {
 alert("Hemos guardado tu nombre");
}
Estructura for
Las estructuras if y if...else no son muy eficientes cuando se desea ejecutar de forma repetitiva una instrucción. Por ejemplo, si se quiere mostrar un mensaje cinco veces, se podría pensar en utilizar el siguienteif:
var veces = 0;

if(veces < 4) {
 alert("Mensaje");
 veces++;
}
Se comprueba si la variable veces es menor que 4. Si se cumple, se entra dentro del if(), se muestra el mensaje y se incrementa el valor de la variable veces. Así se debería seguir ejecutando hasta mostrar el mensaje las cinco veces deseadas.
Estructura for...in
Una estructura de control derivada de for es la estructura for...in. Su definición exacta implica el uso de objetos, que es un elemento de programación avanzada que no se va a estudiar. Por tanto, solamente se va a presentar la estructura for...in adaptada a su uso en arrays. Su definición formal adaptada a los arrays es:
for(indice in array) {
 ...
}
Si se quieren recorrer todos los elementos que forman un array, la estructura for...in es la forma más eficiente de hacerlo, como se muestra en el siguiente ejemplo:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

for(i in dias) {
 alert(dias[i]);
}
La variable que se indica como indice es la que se puede utilizar dentro del bucle for...in para acceder a los elementos del array. De esta forma, en la primera repetición del bucle la variable i vale 0 y en la última vale 6.
Esta estructura de control es la más adecuada para recorrer arrays (y objetos), ya que evita tener que indicar la inicialización y las condiciones del bucle for simple y funciona correctamente cualquiera que sea la longitud del array. De hecho, sigue funcionando igual aunque varíe el número de elementos del array.





PROGRAMA DE UN JAVASCRIPT BASICO
<head>
<title> Hola Mundo </title>
<script>
alert ('¡Hola mundo SIN!');
</script>
</head>
<body>
alert ('¡Hola mundo SIN!');
</body>
</html>


FUENTES DE INFORMACIÓN

http://www.desarrolloweb.com/articulos/25.php
http://librosweb.es/javascript/capitulo_3/variables.html
http://librosweb.es/javascript/capitulo_3/tipos_de_variables.html
http://librosweb.es/javascript/capitulo_3/operadores.html
http://librosweb.es/javascript/capitulo_3/estructuras_de_control_de_flujo.html


ATENTAMENTE:
SINAÍ VARGAS GARCÍA     lol! 
sinay vargas
sinay vargas

Mensajes : 68
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL INCISO # 3

Mensaje por sinay vargas Mar Abr 22, 2014 12:16 am

JavaScript Avanzado (conceptos, temas que refieren al nivel básico y ejemplo de programa)

En JavaScript avanzado se encuentran algunos temas relacionados a este entre los que encontramos los siguientes:
 Objetos
 Clases


OBJETOS

Los objetos se emplean en JavaScript para organizar el código fuente de una forma más clara y para encapsular métodos y funciones comunes. La forma más sencilla de crear un objeto es mediante la palabra reservada new seguida del nombre de la clase que se quiere instanciar:
var elObjeto = new Object();
var laCadena = new String();
El objeto laCadena creado mediante el objeto nativo String permite almacenar una cadena de texto y aprovechar todas las herramientas y utilidades que proporciona JavaScript para su manejo. Por otra parte, la variable elObjeto almacena un objeto genérico de JavaScript, al que se pueden añadir propiedades y métodos propios para definir su comportamiento.
Un objeto de JavaScript es un array asociativo formado por las propiedades y los métodos del objeto. Así, la forma más directa para definir las propiedades y métodos de un objeto es mediante la notación de puntos de los arrays asociativos.
Un array asociativo es aquel en el que cada elemento no está asociado a su posición numérica dentro del array, sino que está asociado a otro valor específico. Los valores de los arrays normales se asocian a índices que siempre son numéricos. Los valores de los arrays asociativos se asocian a claves que siempre son cadenas de texto.
La forma tradicional de definir los arrays asociativos es mediante la clase Array:
var elArray = new Array();
elArray['primero'] = 1;
elArray['segundo'] = 2;

alert(elArray['primero']);
alert(elArray[0]);


Propiedades
Como los objetos son en realidad arrays asociativos que almacenan sus propiedades y métodos, la forma más directa para definir esas propiedades y métodos es la notación de puntos:
elObjeto.id = "10";
elObjeto.nombre = "Objeto de prueba";
Al contrario de lo que sucede en otros lenguajes orientados a objetos, como por ejemplo Java, para asignar el valor de una propiedad no es necesario que la clase tenga definida previamente esa propiedad.


Métodos

Además de las propiedades, los métodos de los objetos también se pueden definir mediante la notación de puntos:
elObjeto.muestraId = function() {
 alert("El ID del objeto es " + this.id);
}
Los métodos se definen asignando funciones al objeto. Si la función no está definida previamente, es posible crear una función anónima para asignarla al nuevo método del objeto, tal y como muestra el ejemplo anterior.
Uno de los aspectos más importantes del ejemplo anterior es el uso de la palabra reservada this. La palabrathis se suele utilizar habitualmente dentro de los métodos de un objeto y siempre hace referencia al objeto que está llamado a ese método.
De esta forma, en el ejemplo anterior:
var elObjeto = new Object();
elObjeto.id = "10";
elObjeto.muestraId = function() {
 alert("El ID del objeto es " + this.id);
}
Dentro del método, this apunta al objeto que llama a ese método. En este caso, this hace referencia aelObjeto. Por tanto, la instrucción del método muestraId es equivalente a indicar:
alert("El ID del objeto es " + elObjeto.id);
El uso de this es imprescindible para crear aplicaciones reales. El motivo es que nunca se puede suponer el nombre que tendrá la variable (el objeto) que incluye ese método. Como los programadores pueden elegir libremente el nombre de cada objeto, no hay forma de asegurar que la siguiente instrucción funcione siempre correctamente:
alert("El ID del objeto es " + elObjeto.id);
Si el objeto se llamara otroObjeto, el código anterior no funcionaría correctamente. Sin embargo, utilizando la palabra reservada this, el método funciona siempre bien independientemente del nombre del objeto.


Métodos apply() y call()

JavaScript define un par de métodos denominados apply() y call() que son muy útiles para las funciones. Ambos métodos permiten ejecutar una función como si fuera un método de otro objeto. La única diferencia entre los dos métodos es la forma en la que se pasan los argumentos a la función.
El siguiente ejemplo muestra cómo utilizar el método call() para ejecutar una función como si fuera un método del objeto elObjeto:
function miFuncion(x) {
 return this.numero + x;
}

var elObjeto = new Object();
elObjeto.numero = 5;

var resultado = miFuncion.call(elObjeto, 4);
alert(resultado);
El primer parámetro del método call() es el objeto sobre el que se va a ejecutar la función. Como la función se trata como si fuera un método del objeto, la palabra reservada this hace referencia al objeto indicado en la llamada a call(). De esta forma, si en la función se utiliza this.numero, en realidad se está obteniendo el valor de la propiedad numero del objeto.
El resto de parámetros del método call() son los parámetros que se pasan a la función. En este caso, solamente es necesario un parámetro, que es el número que se sumará a la propiedad numero del objeto.
El método apply() es idéntico al método call(), salvo que en este caso los parámetros se pasan como un array:
function miFuncion(x) {
 return this.numero + x;
}
var elObjeto = new Object();
elObjeto.numero = 5;

var resultado = miFuncion.apply(elObjeto, [4]);
alert(resultado);


Notación JSON

JSON (JavaScript Object Notation) es un formato sencillo para el intercambio de información. El formato JSON permite representar estructuras de datos (arrays) y objetos (arrays asociativos) en forma de texto. La notación de objetos mediante JSON es una de las características principales de JavaScript y es un mecanismo definido en los fundamentos básicos del lenguaje.
En los últimos años, JSON se ha convertido en una alternativa al formato XML, ya que es más fácil de leer y escribir, además de ser mucho más conciso. No obstante, XML es superior técnicamente porque es un lenguaje de marcado, mientras que JSON es simplemente un formato para intercambiar datos.
La especificación completa de JSON se puede consultar en RFC 4627 y su tipo MIME oficial esapplication/json.
Como ya se sabe, la notación tradicional de los arrays es tediosa cuando existen muchos elementos:
var modulos = new Array();
modulos[0] = "Lector RSS";
modulos[1] = "Gestor email";
modulos[2] = "Agenda";
modulos[3] = "Buscador";
modulos[4] = "Enlaces";
Para crear un array normal mediante JSON, se indican sus valores separados por comas y encerrados entre corchetes. Por lo tanto, el ejemplo anterior se puede reescribir de la siguiente manera utilizando la notación JSON:
var modulos = ["Lector RSS", "Gestor email", "Agenda", "Buscador", "Enlaces"];


Clases

Los objetos que se han visto hasta ahora son una simple colección de propiedades y métodos que se definen para cada objeto individual. Sin embargo, en la programación orientada a objetos, el concepto fundamental es el de clase.
La forma habitual de trabajo consiste en definir clases a partir de las cuales se crean los objetos con los que trabajan las aplicaciones. Sin embargo, JavaScript no permite crear clases similares a las de lenguajes como Java o C++. De hecho, la palabra class sólo está reservada para su uso en futuras versiones de JavaScript.
A pesar de estas limitaciones, es posible utilizar en JavaScript unos elementos parecidos a las clases y que se denominan pseudoclases. Los conceptos que se utilizan para simular las clases son las funciones constructoras y el prototype de los objetos.


Funciones constructoras
Al contrario que en los lenguajes orientados a objetos, en JavaScript no existe el concepto de constructor. Por lo tanto, al definir una clase no se incluyen uno o varios constructores. En realidad, JavaScript emula el funcionamiento de los constructores mediante el uso de funciones.
En el siguiente ejemplo, se crea un objeto genérico y un objeto de tipo array:
var elObjeto = new Object();
var elArray = new Array(5);
En los dos casos, se utiliza la palabra reservada new y el nombre del tipo de objeto que se quiere crear. En realidad, ese nombre es el nombre de una función que se ejecuta para crear el nuevo objeto. Además, como se trata de funciones, es posible incluir parámetros en la creación del objeto.
JavaScript utiliza funciones para simular los constructores de objetos, por lo que estas funciones se denominan"funciones constructoras". El siguiente ejemplo crea una función llamada Factura que se utiliza para crear objetos que representan una factura.
function Factura(idFactura, idCliente) {
 this.idFactura = idFactura;
 this.idCliente = idCliente;
}
Cuando se crea un objeto es habitual pasar al constructor de la clase una serie de valores para inicializar algunas propiedades. Este concepto también se utiliza en JavaSript, aunque su realización es diferente. En este caso, la función constructora inicializa las propiedades de cada objeto mediante el uso de la palabra reservada this.
La función constructora puede definir todos los parámetros que necesita para construir los nuevos objetos y posteriormente utilizar esos parámetros para la inicialización de las propiedades. En el caso anterior, la factura se inicializa mediante el identificador de factura y el identificador de cliente.
Después de definir la función anterior, es posible crear un objeto de tipo Factura y simular el funcionamiento de un constructor:
var laFactura = new Factura(3, 7);
Así, el objeto laFactura es de tipo Factura, con todas sus propiedades y métodos y se puede acceder a ellos utilizando la notación de puntos habitual:
alert("cliente = " + laFactura.idCliente + ", factura = " + laFactura.idFactura);
Normalmente, las funciones constructoras no devuelven ningún valor y se limitan a definir las propiedades y los métodos del nuevo objeto.


Prototype

Las funciones constructoras no solamente pueden establecer las propiedades del objeto, sino que también pueden definir sus métodos. Siguiendo con el ejemplo anterior, se puede crear un objeto completo llamadoFactura con sus propiedades y métodos:
function Factura(idFactura, idCliente) {
 this.idFactura = idFactura;
 this.idCliente = idCliente;

 this.muestraCliente = function() {
   alert(this.idCliente);
 }

 this.muestraId = function() {
   alert(this.idFactura);
 }
}
Una vez definida la pseudoclase mediante la función constructora, ya es posible crear objetos de ese tipo. En el siguiente ejemplo se crean dos objetos diferentes y se emplean sus métodos:
var laFactura = new Factura(3, 7);
laFactura.muestraCliente();
var otraFactura = new Factura(5, 4);
otraFactura.muestraId();
Incluir los métodos de los objetos como funciones dentro de la propia función constructora, es una técnica que funciona correctamente pero que tiene un gran inconveniente que la hace poco aconsejable.


Excepciones
JavaScript dispone de un mecanismo de tratamiento de excepciones muy similar al de otros lenguajes de programación como Java. Para ello, define las palabras reservadas try, catch y finally.
La palabra reservada try se utiliza para encerrar el bloque de código JavaScript en el que se van a controlar las excepciones. Normalmente, el bloque definido por try va seguido de otro bloque de código definido porcatch.
Cuando se produce una excepción en el bloque try, se ejecutan las instrucciones contenidas dentro del bloquecatch asociado. Después del bloque catch, es posible definir un bloque con la palabra reservada finally. Todo el código contenido en el bloque finally se ejecuta independientemente de la excepción ocurrida en el bloque try.
Un bloque try debe ir seguido obligatoriamente de un bloque catch o de un bloque finally. También es posible que vaya seguido de los dos bloques.


Clausura (closure)
El concepto de clausura closure en inglés) es conocido y utilizado en varios lenguajes de programación desde hace décadas. JavaScript también permite utilizar clausuras en el código de las aplicaciones. En este caso, las clausuras se crean de forma implícita, ya que no existe ninguna forma de declararlas explícitamente.


FUENTES DE INFORMACIÓN

http://librosweb.es/ajax/capitulo_3.html
http://librosweb.es/ajax/capitulo_3/clases.html
http://librosweb.es/ajax/capitulo_3/otros_conceptos.html



ATENTAMENTE:
SINAÍ VARGAS GARCÍA
sinay vargas
sinay vargas

Mensajes : 68
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL INCISO Nº 2

Mensaje por CINTHIA CADENA PEREZ Miér Abr 23, 2014 9:11 pm

RESPUESTA AL INCISO Nº 2

JAVASCRIPT BÁSICO (CONCEPTOS, TEMAS QUE REFIEREN AL NIVEL BÁSICO Y EJEMPLO DE PROGRAMA)

¿Qué es JavaScript?
JavaScript es una de las múltiples maneras que han surgido para extender las capacidades del lenguaje HTML (lenguaje para la construcción de páginas Web). JavaScript no es un lenguaje de programación propiamente dicho como C o C++, es un lenguaje script u orientado a documento, como se nombra también a los lenguajes de macros que tienen muchos procesadores de texto y plantillas de cálculo.[1]. No se puede desarrollar un programa con JavaScript que se ejecute fuera de un Navegador. JavaScript es un lenguaje interpretado que se embebe en una página Web. Un lenguaje interpretado significa que a las instrucciones las analiza y procesa el navegador en el momento que deben ser ejecutadas.

¿Donde se edita el código de JavaScript?

El código de JavaScript se puede incluir en cualquier documento HTML, o todo aquel que se pueda traducir en HTML en el navegador del cliente, ya sea PHP, ASP, SVG, entre otros.

El código va dentro de las etiquetas HTML <script type="text/javascript"> y </script>.
JavaScript no es un lenguaje de programación propiamente dicho, es un lenguaje de Script u orientado a documento, es una secuencia de comandos que se evalúa y ejecuta sobre la marcha, es usado para crear pequeños programas dentro de una página web que permiten interactuar con el usuario. Algunas


Elementos básicos para programar en JavaScript
JavaScript no es un lenguaje de programació propiamente dicho, es un lenguaje de Script u orientado a documento, es una secuencia de comandos que se evalúa y ejecuta sobre la marcha, es usado para crear pequeños programas dentro de una página web que
permiten interactuar con el usuario.
Algunas Características son:
• Permite interactuar con el usuario ( a pesar de haberlo dicho anteriormente, creo que es necesario reiterarlo).
• Crear efectos especiales
• Se pueden validar datos de un formulario.
• Crear rollovers (cambia la imagen cuando se pasa el mouse).
• Crear navegadores desplegables.
• Se puede realizar la apertura de ventanas secundarias.
• Trabajar con la barra de estado, Etc.

Donde se escribe un JAVASCRIPT?
• La programación de JavaScript se realiza en un documento HTML
• Se pueden incorporar en la cabecera entre las etiquetas <HEAD> </HEAD>
• En el cuerpo de la página entre las etiquetas <BODY> </BODY>, a esto se le llama código incrustado.
• Se pueden introducir varios script en una misma página con etiquetas <script> diferentes
• O se puede realizar un archivo externo.
• Cuando existen varias funciones probadas y que pueden servir a mas de un programa se puede realizar un archivo externo.
• El archivo externo normalmente tiene la extensión .JavaScript y se lo incluye de la siguiente manera, suponiendo que el archivo con las funciones se llame externo: <script src=“externo.JS”> </script>

Formas de Ejecutarlo
• Directa: se incorpora el script en el cuerpo o en la cabecera de una página html de modo que el navegador interprete cada línea.
• Como respuesta a un evento: Un evento es la acción que realiza el usuario mientras visita una página. Por ejemplo el movimiento el mouse, pulsar un botón, la selección de un texto o la carga de un formulario. El programa captura el evento realizado por el usuario, realiza una tarea y emite una respuesta mediante el uso de manejadores de eventos. Estos manejadores son funciones propias de JavaScript.

¿Quien interpreta las instrucciones?
Incorporamos acá un concepto básico que se desarrollará en otras materias de la carrera: el modelo cliente/servidor. Este modelo es definido por IBM de la siguiente manera: “Es la tecnología que proporciona al usuario final acceso transparente a las aplicaciones, datos, servicios, o cualquier otro recurso, a través de la organización, en múltiples plataformas. El modelo soporta un medio ambiente distribuido en el cual los requerimientos de servicios hechos por estaciones de trabajo inteligentes o “clientes”, resultan en un trabajo realizado por otros computadores llamados “servidores”.
1. Es una relación entre procesos corriendo en máquinas separadas en donde:
a) El Servidor es el proveedor de servicios.
b) El Cliente es el consumidor de servicios.
2. El Cliente y el Servidor interactúan por medio de pasajes de mensajes.
a) El Cliente solicita el servicio
b) El Servidor proporciona una respuesta.
Por tanto existen dos actores: el servidor y el cliente. En esta arquitectura, la computadora de los usuarios (cliente), produce una demanda de información a la computadora que proporciona información (servidor) quien da respuesta a la demanda del cliente.


Nuestro primer JavaScript
Haremos nuestro primer programa en JavaScript, escriba el siguiente código y guárdelo con el nombre primer_js.htm en su disquete
<html><body>
<script type=”text/javascript”>
document.write(“Hola programador!!!”)
</script>
</body></html>

Ejemplo
En este caso incorporamos una expresión javascript en un formulario en donde declaramos un botón con el texto presione. Al presionar el botón escribe en el documento la frase Hola Programador.
La expresión onClick es JavaScript, fíjese un detalle: luego de onClick = la expresión documentr.write está entre comillas dobles y el texto se encuentra en comillas simples.
Desde un evento para que muestre una ventana de
alerta:
<html><body>
<FORM>
<INPUT TYPE="button" NAME="boton"
VALUE="Presione" onClick="alert('Hola
Programador!!!')">
</FORM>
</body></html>

Variables y Operadores en JavaScript
En este capítulo veremos algunos elementos muy importantes a la hora de trabajar con JavaScript acompañados de ejemplos que ustedes podrán realizar para probar lo que se dice. Los ítems a tratar son:
1. Qué son las Variables
2. Qué son los operadores
1. Qué son las variables:
Una Variable es un espacio de memoria en donde se alberga un dato. Las variables deben tener un nombre, que puede ser cualquiera, por ejemplo pepe, respuesta, consulta, etc.
• Se forman con caracteres alfanuméricos o guión bajo.
o ejemplos: sumando_1, A, B, sumando2, _A, etc.

Qué son los operadores
Los operadores son símbolos que se utilizan para trabajar con las variables, tal como se trabaja en la aritmética elemental, los signos mas y menos so operadores. A continuación se listan los operadores usados en JavaScript con un ejemplo correspondiente.
Aritméticos:
o Suma: +
o Resta: -
o Multiplicación: *
o División: /
o Resto de la división: %
EJEMPLO
<HTML><HEAD><TITLE>LABORATORIO
1</TITLE></HEAD>
<script>
document.write('texto que saldrá en el script<br>')
var a=6 , b=2
c= a*b;
d= a/b;
e= a%b;
f= a+b;
document.write('a= '+ a + '<br>b= ' + b + '<br>c= ' + c);
document.write('<br>d= ' + d +'<br>e= ' + e + '<br>f='+f)
</script>
</BODY></HTML>

Bibliografía:
*http://aprendeenlinea.udea.edu.co/lms/moodle/course/view.php?id=414
*http://www.herrera.unt.edu.ar/programador/materias/labo1/libro/conceptos%20bsicos%20de%20javascript%20con%20ejemplos.pdf
*http://www.uazuay.edu.ec/estudios/sistemas/lenguaje_iii/MAnualJavaScript/introduccion.htm
*www.slideshare.net/jacobflores/01-conceptos-bsicosdejavascript‎

ATTE: CINTHIA CADENA PEREZ



CINTHIA CADENA PEREZ

Mensajes : 51
Fecha de inscripción : 01/02/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL INCISO Nº 1

Mensaje por CINTHIA CADENA PEREZ Miér Abr 23, 2014 9:35 pm

REPUESTA DEL INCISO Nº 1

CONCEPTOS BÁSICOS DE RIA (RICH INTERNET APPLICATIONS)

DEFINICION
Las rich Internet applications, o RIA (en español "aplicaciones de Internet enriquecidas"), son aplicaciones web que tienen la mayoría de las características de las aplicaciones de escritorio tradicionales. Estas aplicaciones utilizan un navegador web estandarizado para ejecutarse y por medio de complementos o mediante una máquina virtual se agregan las características adicionales.
Las RIA surgen como una combinación de las ventajas que ofrecen las aplicaciones web y las aplicaciones tradicionales. Buscan mejorar la experiencia y productividad del usuario.
Normalmente en las aplicaciones web, hay una recarga continua de páginas cada vez que el usuario pulsa sobre un enlace. De esta forma se produce un tráfico muy alto entre el cliente y el servidor, llegando muchas veces a recargar la misma página con un cambio mínimo.
En los entornos RIA, en cambio, no se producen recargas de página, ya que desde el principio se carga toda la aplicación, y sólo se produce comunicación con el servidor cuando se necesitan datos externos como datos de una base de datos o de otros ficheros externos.

Arquitectura
Generalmente se tiene una aplicación cliente “stateful” y una capa de servicios separada. Las RIA se apoya más sobre un desarrollo “cliente-servidor” en vez de un desarrollo web tradicional, en donde el estado se mantiene en el servidor en sesiones. El cliente sabe acerca de sí mismo y el tipo de datos que está solicitando y únicamente solicita los datos que necesita sin ninguna otra información.
Cliente
Se maneja la interacción entre el usuario y la interfaz de usuario, el usuario invoca comandos, actualiza vistas y carga datos. Aquí se mantiene el estado de la aplicación, se manejan todas las peticiones de datos hacia el servidor y se controla como se presentan los datos.
Servidor
Aquí se manejan y se procesan todas las peticiones de la aplicación cliente y delega las acciones en el servidor, estas pueden ser, guardar datos en la base de datos, actualizar los archivos del sistema, retornar datos al servidor, o algún tipo de proceso analítico. Determina y le da formato a los datos que son retornados al cliente.

Aplicaciones
Consisten en el aprovechamiento de la experiencia del usuario en herramientas y funciones de escritorio tan naturales como copiar, cortar y pegar, redimensionar columnas, y ordenar etc., con el alcance y la flexibilidad de presentación y despliegue que ofrecen las aplicaciones o páginas Web junto con lo mejor de la multimedia (voz, vídeo, etc.).
Entre los beneficios principales de aplicaciones RIA tenemos una mejora importante en la experiencia visual, que hacen del uso de la aplicación algo muy sencillo, ofrece mejoras en la conectividad y despliegue instantáneo de la aplicación, agilizando su acceso, garantizan la desvinculación de la capa de presentación es decir acceso a la aplicación desde cualquier computador en cualquier lugar del mundo.

Características clave
Accesibilidad: AJAX en nativo en los navegadores web y es el único RIA framework que puede ser encontrado por los diferentes motores de búsqueda. Aunque Adobe Flash ha dado grandes pasos en esta dirección.
Comunicaciones avanzadas: con servidores que soporten nuevas tecnologías se puede mejorar la experiencia del usuario al utilizar protocolos de red optimizados y entradas y salidas asíncronas. Se requiere de una conexión de banda ancha confiable.
Complejidad: soluciones avanzadas puede ser más difíciles de diseñar, desarrollar, implementar y depurar que las aplicaciones web tradicionales.
Consistencia: la interfaz de usuario y las experiencias pueden ser controlada por el sistema operativo, el monitoreo del rendimiento y diagnóstico de errores puede ser difícil.
Instalación y mantenimiento: se requiere de la instalación de un plugin o una máquina virtual o sandbox, que generalmente es más rápida que la instalación de una aplicación tradicional y esta no se puede automatizar. Las actualizaciones son automáticas.
Offline: puede ser usada sin conexión a Internet, reteniendo el estado en la máquina cliente.
Seguridad: se mejora la seguridad por medio de actualizaciones automáticas y sandbox. Pero las extensiones por sí mismas son sujetas a vulnerabilidades.
Rendimiento: puede ser mejorado dependiendo de la aplicación y de las características de la red. Aplicaciones que pueden procesar localmente en el cliente evitan viajes hacia el servidor lo que incrementa su rendimiento. Dándole más trabajo al cliente también se puede incrementar el rendimiento del servidor. Por el contrario los recursos necesarios hacen difícil que las aplicaciones puedan ejecutarse en dispositivos pequeños, móviles o embebidos.
Riqueza: añadiendo características que no son nativas en los navegadores web como captura de video.
Beneficios
A pesar de que el desarrollo de aplicaciones multimedia para navegadores web está mucho más limitada y es más difícil que otro tipo de aplicaciones de escritorio, los esfuerzos se justifican por varios motivos:
• No necesitan instalación (solo es necesario mantener actualizado el navegador web).
• Las actualizaciones hacia nuevas versiones son automáticas.
• Se pueden utilizar desde cualquier ordenador con una conexión a Internet sin depender del sistema operativo que este utilice.
• Generalmente es menos probable la infección por virus, que utilizando por ejemplo programas ejecutables.
• Más capacidad de respuesta, ya que el usuario interactúa directamente con el servidor, sin necesidad de recargar la página.
• Ofrecen aplicaciones interactivas que no se pueden obtener utilizando solo HTML, incluyendo arrastrar y pegar, cálculos en el lado del cliente sin la necesidad de enviar la información al servidor.
• Evita la problemática del uso de diferentes navegadores al abstraerse de ellos a través de un framework.

Herramientas y Frameworks
Hay muchas herramientas para el desarrollo de aplicaciones RIA que se pueden observar en la lista Frameworks para "Rich Internet Applications".
Entre estas herramientas se pueden resaltar Adobe Flash, JavaFX, y Microsoft Silverlight por su penetración en el mercado del 96%, 76%, y el 66% repectivamente (reporte de agosto de 2012).1
A la fecha (septiembre del 2012) se aprecia una fuerte tendencia para favorecer las herramientas basadas en HTML52 en lugar de las herramientas basadas en plug-ins lo que nos lleva a resaltar las siguientes herramientas Java applet 4.20, HTML5 3.70, ZK 6.5, GWT 2.10, Silverlight 1.70, Adobe Flex 1.00, JavaFX 0.5.
Esta tendencia se puede corroborar en las siguientes publicaciones: Adobe no producirá mas versiones de Flash para dispositivos moviles3 o televisiones,4 5 Menciones sobre que Microsoft abandonara Silverlight después de la versión 5,6 El fín de los plugins para navegadores.7

Ejemplos de RIA
• Flickr

Ventajas de RIA

Ventajas respecto a aplicaciones de escritorio Único punto de instalación y mantenimiento en el servidor web. Los clientes no requieren de ninguna instalación. Clientes siempre actualizados a la última versión, disponible en el servidor web. Multiplataforma, accesible desde Windows, Linux, Mac OS, etc. Ventajas respecto a aplicaciones web Experiencia de usuario similar a aplicaciones de escritorio. Desaparece problemática de incompatibilidad entre navegadores. Reducción de carga del servidor al estar la capa de presentación en el cliente. Potencia en streaming de video.

Inconvenientes de RIA
Inconvenientes Necesidad de instalar plug-ins. Necesidad de disponer de mayor potencia en los dispositivos cliente. Riesgo de sobrecargar la interfaz de usuario por querer explotar las posibilidades de RIA. Falta de profesionales con experiencia en RIA. Problemas relativos a la accesibilidad de la aplicación. Botones de Atrás y Refrescar.

Diferencias entre un desarrollo tradicional y uno RIA
Para desarrolladores de aplicaciones de escritorio Adaptarse a trabajar con las restricciones de seguridad del navegador (no podrán guardar información en disco, acceder al registro o hardware local...) Librerías más limitadas que en aplicaciones de escritorio. Para desarrolladores de aplicaciones web Adaptarse a la arquitectura orientada a servicios (SOA), ya que la capa de presentación queda en el cliente, mientras que la lógica de negocio está en el servidor.


BIBLIOGRAFIA:
http://es.wikipedia.org/wiki/Rich_Internet_Applications
http://www.upf.edu/hipertextnet/numero-9/ria-accesibilidad-web.html
http://www.slideshare.net/lisepi09/rich-internet-applications-2615942
www.interfazmx.com/pdfs/ADBFX001.pdf‎
afelipelc.files.wordpress.com/2012/01/intro-da3.pdf‎

ATTE: CINTHIA CADENA PEREZ Laughing 

CINTHIA CADENA PEREZ

Mensajes : 51
Fecha de inscripción : 01/02/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL REACTIVO 6

Mensaje por thanahi Mar Abr 29, 2014 11:06 pm

MANEJO DE EVENTOS JAVA SCRIPT (CONCEPTOS O DESCRIPCIÓN DE LOS MÁS COMUNES Y UN EJEMPLO DE PROGRAMA)

En JavaScript, la interacción con el usuario se consigue mediante la captura de los eventos que éste produce. Un evento es una acción del usuario ante la cual puede realizarse algún proceso (por ejemplo, el cambio del valor de un formulario, o la pulsación de un enlace).
Los eventos se capturan mediante los manejadores de eventos. El proceso a realizar se programa mediante funciones JavaScript llamadas por los manejadores de eventos.

Un evento ocurre cuando alguna situación produce un cambio, por ejemplo, cuando se da clic sobre algún elemento de la página y este debe producir alguna acción, o cuando se pasa el cursor por encima de un cuadro y este debe cambiar de color. Es decir, un evento ocurre cuando el usuario interactúa con la página web.

La mayoría de los eventos se refiere a la interfaz del navegador, estos son agregados generalmente a un elemento específico de la página. Otros eventos se refieren a las acciones del navegador, por ejemplo, cuando un documento o una imagen han cargado completamente en la página.

Para capturar un evento sobre un objeto, se asigna una función específica para manejar el evento cuando este suceda.

Muchas etiquetas HTML tienen eventos propios. Se puede definir el código de un script que debe ser ejecutado cuando uno de esos eventos ocurren usando el nombre del evento como un atributo. A continuación se muestra un ejemplo en el cual se manejan dos eventos (onmouseover y onmouseout) del elemento. La palabra reservada this se refiere al objeto que dispara el evento, en este caso es el elemento span.

<html>

<head>
<title> Ejemplo de eventos </title>
//Cambia el color de texto y el fondo del elemento

<span style="background-color:yellow;"
onmouseover="this.style.backgroundColor='black';this.style.color='white'"
onmouseout="this.style.backgroundColor='yellow';this.style.color=''">
Ejemplo con manejadores de eventos
</span>

</head>

<body>
</body>

</html>

Ejemplo con manejadores de eventos

La siguiente tabla resume los eventos más importantes definidos por JavaScript:

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) 6dx3lw

Fuentes de información:
http://librosweb.es/ajax/capitulo_6.html
http://www.elcodigo.net/tutoriales/javascript/javascript5.html
http://codigoprogramacion.com/cursos/javascript/eventos-en-javascript-onclick-onload-onmouseoveronmouseout.html#.U2Bw8fl5O-A


ATENTAMENTE: THANAHI MEDRANO RUIZ  Like a Star @ heaven 

thanahi

Mensajes : 52
Fecha de inscripción : 30/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA AL REACTIVO 4

Mensaje por thanahi Dom Mayo 04, 2014 9:24 pm

DEFINICIÓN Y UN EJEMPLO DE PROGRAMA USANDO DOM (DOCUMENT OBJECT MODEL)

El Modelo de Objetos del Documento (DOM) es una interfaz de programación de aplicaciones (API) para documentos HTML y XML. Define la estructura lógica de los documentos y el modo en que se accede y manipula un documento. En la especificación del DOM, el término "documento" se utiliza en un sentido amplio. XML se utiliza cada vez más como un medio para representar muchas clases diferentes de información que puede ser almacenada en sistemas diversos, y mucha de esta información se vería, en términos tradicionales, más como datos que como documentos. Sin embargo, XML presenta estos datos como documentos, y se puede usar el DOM para manipular estos datos.
Con el Modelo de Objetos del Documento los programadores pueden construir documentos, navegar por su estructura, y añadir, modificar o eliminar elementos y contenido. Se puede acceder a cualquier cosa que se encuentre en un documento HTML o XML, y se puede modificar, eliminar o añadir usando el Modelo de Objetos del Documento, salvo algunas excepciones. En particular, aún no se han especificado las interfaces DOM para los subconjuntos internos y externos de XML.

En el DOM, los documentos tienen una estructura lógica que es muy parecida a un árbol. Para ser más precisos, es más bien como un "bosque" o una "arboleda", que puede contener más de un árbol. Sin embargo, el DOM no especifica que los documentos deban ser implementados como un árbol o un bosque, ni tampoco especifica cómo deben implementarse las relaciones entre objetos. El DOM es un modelo lógico que puede implementarse de cualquier manera que sea conveniente. En esta especificación, usamos el término modelo de estructura para describir la representación en forma de árbol de un documento, evitando la utilización de términos tales como "árbol" o "bosque" para evitar la implicación de una implementación en particular. Una propiedad importante de los modelos de estructura del DOM es su isomorfismo estructural: si dos implementaciones cualesquiera del Modelo de Objetos del Documento se usan para crear una representación del mismo documento, ambas crearán el mismo modelo de estructura, con exactamente los mismos objetos y relaciones.

Se eligió el nombre "Modelo de Objetos del Documento" porque es un "modelo de objetos" en el sentido tradicional del diseño orientado a objetos: los documentos se modelizan usando objetos, y el modelo comprende no solamente la estructura de un documento, sino también el comportamiento de un documento y de los objetos de los cuales se compone. En otras palabras, los nodos del diagrama anterior no representan una estructura de datos, sino que representan objetos, los cuales pueden tener funciones e identidad. Como modelo de objetos, el DOM identifica:
• las interfaces y objetos usados para representar y manipular un documento
• la semántica de estas interfaces y objetos, incluyendo comportamiento y atributos
• las relaciones y colaboraciones entre estas interfaces y objetos

Tradicionalmente, la estructura de los documentos SGML se ha representado mediante un modelo de datos abstractos, no con un modelo de objetos. En un modelo de datos abstractos, el modelo se centra en los datos. En los lenguajes de programación orientados a objetos, los datos se encapsulan en objetos que ocultan los datos, protegiéndolos de su manipulación directa desde el exterior. Las funciones asociadas con estos objetos determinan cómo pueden manipularse los objetos, y son parte del modelo de objetos.

El Modelo de Objetos del Documento consiste actualmente de dos partes, el Núcleo del DOM y el DOM HTML. El Núcleo del DOM representa la funcionalidad usada para los documentos XML, y también sirve de base para el DOM HTML. Una implementación conforme del DOM debe implementar todas las interfaces fundamentales del capítulo sobre el Núcleo con la semántica definida. Además, debe implementar o bien el DOM HTML o bien las interfaces extendidas (XML), o ambas, con la semántica definida.

DOM o Document Object Model es un conjunto de utilidades específicamente diseñadas para manipular documentos XML. Por extensión, DOM también se puede utilizar para manipular documentos XHTML y HTML. Técnicamente, DOM es una API de funciones que se pueden utilizar para manipular las páginas XHTML de forma rápida y eficiente.
Antes de poder utilizar sus funciones, DOM transforma internamente el archivo XML original en una estructura más fácil de manejar formada por una jerarquía de nodos. De esta forma, DOM transforma el código XML en una serie de nodos interconectados en forma de árbol.
El árbol generado no sólo representa los contenidos del archivo original (mediante los nodos del árbol) sino que también representa sus relaciones (mediante las ramas del árbol que conectan los nodos).
Aunque en ocasiones DOM se asocia con la programación web y con JavaScript, la API de DOM es independiente de cualquier lenguaje de programación. De hecho, DOM está disponible en la mayoría de lenguajes de programación comúnmente empleados.

Antes de poder utilizar las funciones de DOM, los navegadores convierten automáticamente la página HTML anterior en la siguiente estructura de árbol de nodos:

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) 2qdwo6x

La ventaja de emplear DOM es que permite a los programadores disponer de un control muy preciso sobre la estructura del documento HTML o XML que están manipulando. Las funciones que proporciona DOM permiten añadir, eliminar, modificar y reemplazar cualquier nodo de cualquier documento de forma sencilla.

EJEMPLOS:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

<head>
<title>Changing color and font-size example</title>
<script type="text/javascript">
function changeText() {
var p = document.getElementById("pid");
p.style.color = "blue"
p.style.fontSize = "18pt"
}
</script>
</head>
<body>
<p id="pid"
onclick="window.location.href = 'http://www.cnn.com/';">linker</p>
<form>
<p><input value="rec" type="button" onclick="changeText();"></p>
</form>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Demo DOM con tablas</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
  var cont=1;
       function addrow(tc1,tc2) {
               var tbl = document.getElementById('tabla');
               var row = document.createElement('tr');
               var c0 = document.createElement('td')
     c0.innerHTML=cont;
     cont++;
               var c1 = document.createElement('td')
     c1.innerHTML=tc1;
               var c2 = document.createElement('td')
     c2.innerHTML=tc2;
               row.appendChild(c0);
               row.appendChild(c1);
               row.appendChild(c2);
               tbl.appendChild(row);
       }

       function addrow2() {
          var frm = document.getElementById('forma');
          addrow(frm.c1.value,frm.c2.value);
       }
</script>
</head>
<body>
<h2>Demo de DOM con tablas</h2>
<form id='forma'>
Columna 1:<input type="text" name="c1">
Columna 2:<input type="text" name="c2">
<input type="button" value="add"  onclick="javascript:addrow2()">
<input type="reset">
</form>
<div onclick="javascript:addrow('vacio','vacio')">Adicionar fila</div><br/>
<table cellpadding="0" cellspacing="0" border="1"  id="tabla">
<tr>
<td></td><th>col 1</th><th>col 2</th>
</tr>
</table>
<hr>
</body>
</html>

Fuentes de información
•http://cic.puj.edu.co/wiki/doku.php?id=materias:laboratorio_de_lenguajes_ii:lableng2:ejemplosdom
•http://www.tierradenomadas.com/tw006b.html
•http://html.conclase.net/w3c/dom1-es/introduction.html
•https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Ejemplos#_Ejemplo_2.3A_Atributos_de_una_imagen_
•http://librosweb.es/ajax/capitulo_4.html


ATENTAMENTE: THANAHI MEDRANO RUIZ Like a Star @ heaven

thanahi

Mensajes : 52
Fecha de inscripción : 30/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REACTIVO

Mensaje por AngelesAT Vie Mayo 09, 2014 12:17 am

Conceptos básicos de RIA (Rich Internet Applications)

Son aplicaciones web que tienen la mayoría de las características de las aplicaciones de escritorio tradicionales. Estas aplicaciones utilizan un navegador web estandarizado para ejecutarse y por medio de complementos o mediante una máquina virtual se agregan las características adicionales.

--Cliente
Se maneja la interacción entre el usuario y la interfaz de usuario, el usuario invoca comandos, actualiza vistas y carga datos. Aquí se mantiene el estado de la aplicación, se manejan todas las peticiones de datos hacia el servidor y se controla como se presentan los datos.

--Servidor
Aquí se manejan y se procesan todas las peticiones de la aplicación cliente y delega las acciones en el servidor, estas pueden ser, guardar datos en la base de datos, actualizar los archivos del sistema, retornar datos al servidor, o algún tipo de proceso analítico. Determina y le da formato a los datos que son retornados al cliente

Características:

Accesibilidad
Comunicaciones avanzadas
Complejidad
Consistencia
Instalación y mantenimiento
Offline
Seguridad
Rendimiento
Riqueza

ATENTAMENTE:
MA. DE LOS ÁNGELES ALONSO TAPIA
TOMAS LOPEZ PEREZ
AngelesAT
AngelesAT

Mensajes : 36
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Re: 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por AngelesAT Vie Mayo 09, 2014 12:23 am

- JavaScript Avanzado (conceptos, temas que refieren al nivel avanzado y ejemplo de programa)

Al igual que sucede con otros lenguajes de programación, los objetos se emplean en JavaScript para organizar el código fuente de una forma más clara y para encapsular métodos y funciones comunes. La forma más sencilla de crear un objeto es mediante la palabra reservada new seguida del nombre de la clase que se quiere instanciar:

var elObjeto = new Object();
var laCadena = new String();
El objeto laCadena creado mediante el objeto nativo String permite almacenar una cadena de texto y aprovechar todas las herramientas y utilidades que proporciona JavaScript para su manejo. Por otra parte, la variable elObjeto almacena un objeto genérico de JavaScript, al que se pueden añadir propiedades y métodos propios para definir su comportamiento.

Definición de un objeto
Técnicamente, un objeto de JavaScript es un array asociativo formado por las propiedades y los métodos del objeto. Así, la forma más directa para definir las propiedades y métodos de un objeto es mediante la notación de puntos de los arrays asociativos.

Un array asociativo es aquel en el que cada elemento no está asociado a su posición numérica dentro del array, sino que está asociado a otro valor específico. Los valores de los arrays normales se asocian a índices que siempre son numéricos. Los valores de los arrays asociativos se asocian a claves que siempre son cadenas de texto.

Como JavaScript ignora los espacios en blanco sobrantes, es posible reordenar las claves y valores para que se muestren más claramente en el código fuente de la aplicación. El ejemplo anterior se puede rehacer de la siguiente manera añadiendo nuevas líneas para separar los elementos y añadiendo espacios en blanco para tabular las claves y para alinear los valores:

var titulos = {
 rss:    "Lector RSS",
 email:  "Gestor de email",
 agenda: "Agenda"
};


ATENTAMENTE
MA. DE LOS ÁNGELES ALONSO TAPIA
TOMAS LOPEZ PEREZ
AngelesAT
AngelesAT

Mensajes : 36
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Conceptos básicos de RIA (Rich Internet Applications)

Mensaje por JENESIS REYES Y EQUIPO. Vie Mayo 09, 2014 8:14 am


DEFINICION
LAS RICH INTERNET APPLICATIONS, o RIA (en español "aplicaciones de Internet enriquecidas") Son aplicaciones web que tienen la mayoría de las características de las aplicaciones de escritorio tradicionales. Estas aplicaciones utilizan un navegador web estandarizado para ejecutarse y por medio de complementos o mediante una máquina virtual se agregan las características adicionales. Las RIA surgen como una combinación de las ventajas que ofrecen las aplicaciones web y las aplicaciones tradicionales. Buscan mejorar la experiencia y productividad del usuario.
Normalmente en las aplicaciones web, hay una recarga continua de páginas cada vez que el usuario pulsa sobre un enlace. De esta forma se produce un tráfico muy alto entre el cliente y el servidor, llegando muchas veces a recargar la misma página con un cambio mínimo.
En los entornos RIA, en cambio, no se producen recargas de página, ya que desde el principio se carga toda la aplicación, y sólo se produce comunicación con el servidor cuando se necesitan datos externos como datos de una base de datos o de otros ficheros externos.

CARACTERÍSTICAS:
Consistencia: la interfaz de usuario y las experiencias pueden ser controlada por el sistema operativo, el monitoreo del rendimiento y diagnóstico de errores puede ser difícil.
Instalación y mantenimiento: se requiere de la instalación de un plugin o una máquina virtual o sandbox, que generalmente es más rápida que la instalación de una aplicación.
Seguridad: se mejora la seguridad por medio de actualizaciones automáticas y sandbox. Pero las extensiones por sí mismas son sujetas a vulnerabilidades.
Accesibilidad: AJAX en nativo en los navegadores web y es el único RIA framework que puede ser encontrado por los diferentes motores de búsqueda.
Comunicaciones avanzadas: con servidores que soporten nuevas tecnologías se puede mejorar la experiencia del usuario al utilizar protocolos de red optimizados y entradas y salidas asíncronas.
Complejidad: soluciones avanzadas puede ser más difíciles de diseñar, desarrollar, implementar y depurar que las aplicaciones web tradicionales.
Rendimiento: puede ser mejorado dependiendo de la aplicación y de las características de la red. Aplicaciones que pueden procesar localmente en el cliente evitan viajes hacia el servidor lo que incrementa su rendimiento.
Riqueza: añadiendo características que no son nativas en los navegadores web como captura de video.

PLATAFORMAS
Adobe AIR
Silverlight
JavaFX Script
AJAX
Adobe Flash
Adobe Flex
Javascript


EQUIPO
CRISTINA MENDOZA JAIMES
JENESIS REYES SAUCEDO
ALMA ROSA PEÑALOZA FIERROS
HORFANEL CALLES JUAREZ
NICOLAS SANCHEZ ANTUNEZ

JENESIS REYES Y EQUIPO.
Invitado


Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Replica a una compañera

Mensaje por sinay vargas Sáb Mayo 10, 2014 11:36 pm

CINTHIA CADENA PEREZ escribió:RESPUESTA AL INCISO Nº 2

JAVASCRIPT BÁSICO (CONCEPTOS, TEMAS QUE REFIEREN AL NIVEL BÁSICO Y EJEMPLO DE PROGRAMA)

¿Qué es JavaScript?
JavaScript es una de las múltiples maneras que han surgido para extender las capacidades del lenguaje HTML (lenguaje para la construcción de páginas Web). JavaScript no es un lenguaje de programación propiamente dicho como C o C++, es un lenguaje script u orientado a documento, como se nombra también a los lenguajes de macros que tienen muchos procesadores de texto y plantillas de cálculo.[1]. No se puede desarrollar un programa con JavaScript que se ejecute fuera de un Navegador. JavaScript es un lenguaje interpretado que se embebe en una página Web. Un lenguaje interpretado significa que a las instrucciones las analiza y procesa el navegador en el momento que deben ser ejecutadas.

¿Donde se edita el código de JavaScript?

El código de JavaScript se puede incluir en cualquier documento HTML, o todo aquel que se pueda traducir en HTML en el navegador del cliente, ya sea PHP, ASP, SVG, entre otros.

El código va dentro de las etiquetas HTML <script type="text/javascript"> y </script>.
JavaScript no es un lenguaje de programación propiamente dicho, es un lenguaje de Script u orientado a documento, es una secuencia de comandos que se evalúa y ejecuta sobre la marcha, es usado para crear pequeños programas dentro de una página web que permiten interactuar con el usuario. Algunas


Elementos básicos para programar en JavaScript
JavaScript no es un lenguaje de programació propiamente dicho, es un lenguaje de Script u orientado a documento, es una secuencia de comandos que se evalúa y ejecuta sobre la marcha, es usado para crear pequeños programas dentro de una página web que
permiten interactuar con el usuario.
Algunas Características son:
• Permite interactuar con el usuario ( a pesar de haberlo dicho anteriormente, creo que es necesario reiterarlo).
• Crear efectos especiales
• Se pueden validar datos de un formulario.
• Crear rollovers (cambia la imagen cuando se pasa el mouse).
• Crear navegadores desplegables.
• Se puede realizar la apertura de ventanas secundarias.
• Trabajar con la barra de estado, Etc.

Donde se escribe un JAVASCRIPT?
• La programación de JavaScript se realiza en un documento HTML
• Se pueden incorporar en la cabecera entre las etiquetas <HEAD> </HEAD>
• En el cuerpo de la página entre las etiquetas <BODY> </BODY>, a esto se le llama código incrustado.
• Se pueden introducir varios script en una misma página con etiquetas <script> diferentes
• O se puede realizar un archivo externo.
• Cuando existen varias funciones probadas y que pueden servir a mas de un programa se puede realizar un archivo externo.
• El archivo externo normalmente tiene la extensión .JavaScript y se lo incluye de la siguiente manera, suponiendo que el archivo con las funciones se llame externo: <script src=“externo.JS”> </script>

Formas de Ejecutarlo
• Directa: se incorpora el script en el cuerpo o en la cabecera de una página html de modo que el navegador interprete cada línea.
• Como respuesta a un evento: Un evento es la acción que realiza el usuario mientras visita una página. Por ejemplo el movimiento el mouse, pulsar un botón, la selección de un texto o la carga de un formulario. El programa captura el evento realizado por el usuario, realiza una tarea y emite una respuesta mediante el uso de manejadores de eventos. Estos manejadores son funciones propias de JavaScript.

¿Quien interpreta las instrucciones?
Incorporamos acá un concepto básico que se desarrollará en otras materias de la carrera: el modelo cliente/servidor. Este modelo es definido por IBM de la siguiente manera: “Es la tecnología que proporciona al usuario final acceso transparente a las aplicaciones, datos, servicios, o cualquier otro recurso, a través de la organización, en múltiples plataformas. El modelo soporta un medio ambiente distribuido en el cual los requerimientos de servicios hechos por estaciones de trabajo inteligentes o “clientes”, resultan en un trabajo realizado por otros computadores llamados “servidores”.
1. Es una relación entre procesos corriendo en máquinas separadas en donde:
a) El Servidor es el proveedor de servicios.
b) El Cliente es el consumidor de servicios.
2. El Cliente y el Servidor interactúan por medio de pasajes de mensajes.
a) El Cliente solicita el servicio
b) El Servidor proporciona una respuesta.
Por tanto existen dos actores: el servidor y el cliente. En esta arquitectura, la computadora de los usuarios (cliente), produce una demanda de información a la computadora que proporciona información (servidor) quien da respuesta a la demanda del cliente.


Nuestro primer JavaScript
Haremos nuestro primer programa en JavaScript, escriba el siguiente código y guárdelo con el nombre primer_js.htm en su disquete
<html><body>
<script type=”text/javascript”>
document.write(“Hola programador!!!”)
</script>
</body></html>

Ejemplo
En este caso incorporamos una expresión javascript en un formulario en donde declaramos un botón con el texto presione. Al presionar el botón escribe en el documento la frase Hola Programador.
La expresión onClick es JavaScript, fíjese un detalle: luego de onClick = la expresión documentr.write está entre comillas dobles y el texto se encuentra en comillas simples.
Desde un evento para que muestre una ventana de
alerta:
<html><body>
<FORM>
<INPUT TYPE="button" NAME="boton"
VALUE="Presione" onClick="alert('Hola
Programador!!!')">
</FORM>
</body></html>

Variables y Operadores en JavaScript
En este capítulo veremos algunos elementos muy importantes a la hora de trabajar con JavaScript acompañados de ejemplos que ustedes podrán realizar para probar lo que se dice. Los ítems a tratar son:
1. Qué son las Variables
2. Qué son los operadores
1. Qué son las variables:
Una Variable es un espacio de memoria en donde se alberga un dato. Las variables deben tener un nombre, que puede ser cualquiera, por ejemplo pepe, respuesta, consulta, etc.
• Se forman con caracteres alfanuméricos o guión bajo.
o ejemplos: sumando_1, A, B, sumando2, _A, etc.

Qué son los operadores
Los operadores son símbolos que se utilizan para trabajar con las variables, tal como se trabaja en la aritmética elemental, los signos mas y menos so operadores. A continuación se listan los operadores usados en JavaScript con un ejemplo correspondiente.
Aritméticos:
o Suma: +
o Resta: -
o Multiplicación: *
o División: /
o Resto de la división: %
EJEMPLO
<HTML><HEAD><TITLE>LABORATORIO
1</TITLE></HEAD>
<script>
document.write('texto que saldrá en el script<br>')
var a=6 , b=2
c= a*b;
d= a/b;
e= a%b;
f= a+b;
document.write('a= '+ a + '<br>b= ' + b + '<br>c= ' + c);
document.write('<br>d= ' + d +'<br>e= ' + e + '<br>f='+f)
</script>
</BODY></HTML>

Bibliografía:
*http://aprendeenlinea.udea.edu.co/lms/moodle/course/view.php?id=414
*http://www.herrera.unt.edu.ar/programador/materias/labo1/libro/conceptos%20bsicos%20de%20javascript%20con%20ejemplos.pdf
*http://www.uazuay.edu.ec/estudios/sistemas/lenguaje_iii/MAnualJavaScript/introduccion.htm
*www.slideshare.net/jacobflores/01-conceptos-bsicosdejavascript‎

ATTE: CINTHIA CADENA PEREZ




HOLA AMIGA SOBRE TU INFORMACIÓN QUE NOS HAS PROPORCIONADO ES MUY INTERESANTE POR QUE NOS ESPECIFICAS QUE SIGNIFICA JAVASCRIPT BÁSICO Y ALGUNAS FUNCIONES Y NOS PROPORCIONAS UN EJEMPLO. ME GUSTO TU INFORMACIÓN.

ATENTAMENTE: SINAI VARGAS GARCIA.


 lol!
sinay vargas
sinay vargas

Mensajes : 68
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Re: 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por sinay vargas Sáb Mayo 10, 2014 11:42 pm

thanahi escribió:
DEFINICIÓN Y UN EJEMPLO DE PROGRAMA USANDO DOM (DOCUMENT OBJECT MODEL)

El Modelo de Objetos del Documento (DOM) es una interfaz de programación de aplicaciones (API) para documentos HTML y XML. Define la estructura lógica de los documentos y el modo en que se accede y manipula un documento. En la especificación del DOM, el término "documento" se utiliza en un sentido amplio. XML se utiliza cada vez más como un medio para representar muchas clases diferentes de información que puede ser almacenada en sistemas diversos, y mucha de esta información se vería, en términos tradicionales, más como datos que como documentos. Sin embargo, XML presenta estos datos como documentos, y se puede usar el DOM para manipular estos datos.
Con el Modelo de Objetos del Documento los programadores pueden construir documentos, navegar por su estructura, y añadir, modificar o eliminar elementos y contenido. Se puede acceder a cualquier cosa que se encuentre en un documento HTML o XML, y se puede modificar, eliminar o añadir usando el Modelo de Objetos del Documento, salvo algunas excepciones. En particular, aún no se han especificado las interfaces DOM para los subconjuntos internos y externos de XML.

En el DOM, los documentos tienen una estructura lógica que es muy parecida a un árbol. Para ser más precisos, es más bien como un "bosque" o una "arboleda", que puede contener más de un árbol. Sin embargo, el DOM no especifica que los documentos deban ser implementados como un árbol o un bosque, ni tampoco especifica cómo deben implementarse las relaciones entre objetos. El DOM es un modelo lógico que puede implementarse de cualquier manera que sea conveniente. En esta especificación, usamos el término modelo de estructura para describir la representación en forma de árbol de un documento, evitando la utilización de términos tales como "árbol" o "bosque" para evitar la implicación de una implementación en particular. Una propiedad importante de los modelos de estructura del DOM es su isomorfismo estructural: si dos implementaciones cualesquiera del Modelo de Objetos del Documento se usan para crear una representación del mismo documento, ambas crearán el mismo modelo de estructura, con exactamente los mismos objetos y relaciones.

Se eligió el nombre "Modelo de Objetos del Documento" porque es un "modelo de objetos" en el sentido tradicional del diseño orientado a objetos: los documentos se modelizan usando objetos, y el modelo comprende no solamente la estructura de un documento, sino también el comportamiento de un documento y de los objetos de los cuales se compone. En otras palabras, los nodos del diagrama anterior no representan una estructura de datos, sino que representan objetos, los cuales pueden tener funciones e identidad. Como modelo de objetos, el DOM identifica:
• las interfaces y objetos usados para representar y manipular un documento
• la semántica de estas interfaces y objetos, incluyendo comportamiento y atributos
• las relaciones y colaboraciones entre estas interfaces y objetos

Tradicionalmente, la estructura de los documentos SGML se ha representado mediante un modelo de datos abstractos, no con un modelo de objetos. En un modelo de datos abstractos, el modelo se centra en los datos. En los lenguajes de programación orientados a objetos, los datos se encapsulan en objetos que ocultan los datos, protegiéndolos de su manipulación directa desde el exterior. Las funciones asociadas con estos objetos determinan cómo pueden manipularse los objetos, y son parte del modelo de objetos.

El Modelo de Objetos del Documento consiste actualmente de dos partes, el Núcleo del DOM y el DOM HTML. El Núcleo del DOM representa la funcionalidad usada para los documentos XML, y también sirve de base para el DOM HTML. Una implementación conforme del DOM debe implementar todas las interfaces fundamentales del capítulo sobre el Núcleo con la semántica definida. Además, debe implementar o bien el DOM HTML o bien las interfaces extendidas (XML), o ambas, con la semántica definida.

DOM o Document Object Model es un conjunto de utilidades específicamente diseñadas para manipular documentos XML. Por extensión, DOM también se puede utilizar para manipular documentos XHTML y HTML. Técnicamente, DOM es una API de funciones que se pueden utilizar para manipular las páginas XHTML de forma rápida y eficiente.
Antes de poder utilizar sus funciones, DOM transforma internamente el archivo XML original en una estructura más fácil de manejar formada por una jerarquía de nodos. De esta forma, DOM transforma el código XML en una serie de nodos interconectados en forma de árbol.
El árbol generado no sólo representa los contenidos del archivo original (mediante los nodos del árbol) sino que también representa sus relaciones (mediante las ramas del árbol que conectan los nodos).
Aunque en ocasiones DOM se asocia con la programación web y con JavaScript, la API de DOM es independiente de cualquier lenguaje de programación. De hecho, DOM está disponible en la mayoría de lenguajes de programación comúnmente empleados.

Antes de poder utilizar las funciones de DOM, los navegadores convierten automáticamente la página HTML anterior en la siguiente estructura de árbol de nodos:

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) 2qdwo6x

La ventaja de emplear DOM es que permite a los programadores disponer de un control muy preciso sobre la estructura del documento HTML o XML que están manipulando. Las funciones que proporciona DOM permiten añadir, eliminar, modificar y reemplazar cualquier nodo de cualquier documento de forma sencilla.

EJEMPLOS:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

<head>
<title>Changing color and font-size example</title>
<script type="text/javascript">
function changeText() {
var p = document.getElementById("pid");
p.style.color = "blue"
p.style.fontSize = "18pt"
}
</script>
</head>
<body>
<p id="pid"
onclick="window.location.href = 'http://www.cnn.com/';">linker</p>
<form>
<p><input value="rec" type="button" onclick="changeText();"></p>
</form>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Demo DOM con tablas</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
  var cont=1;
       function addrow(tc1,tc2) {
               var tbl = document.getElementById('tabla');
               var row = document.createElement('tr');
               var c0 = document.createElement('td')
     c0.innerHTML=cont;
     cont++;
               var c1 = document.createElement('td')
     c1.innerHTML=tc1;
               var c2 = document.createElement('td')
     c2.innerHTML=tc2;
               row.appendChild(c0);
               row.appendChild(c1);
               row.appendChild(c2);
               tbl.appendChild(row);
       }

       function addrow2() {
          var frm = document.getElementById('forma');
          addrow(frm.c1.value,frm.c2.value);
       }
</script>
</head>
<body>
<h2>Demo de DOM con tablas</h2>
<form id='forma'>
Columna 1:<input type="text" name="c1">
Columna 2:<input type="text" name="c2">
<input type="button" value="add"  onclick="javascript:addrow2()">
<input type="reset">
</form>
<div onclick="javascript:addrow('vacio','vacio')">Adicionar fila</div><br/>
<table cellpadding="0" cellspacing="0" border="1"  id="tabla">
<tr>
<td></td><th>col 1</th><th>col 2</th>
</tr>
</table>
<hr>
</body>
</html>

Fuentes de información
•http://cic.puj.edu.co/wiki/doku.php?id=materias:laboratorio_de_lenguajes_ii:lableng2:ejemplosdom
•http://www.tierradenomadas.com/tw006b.html
•http://html.conclase.net/w3c/dom1-es/introduction.html
•https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Ejemplos#_Ejemplo_2.3A_Atributos_de_una_imagen_
•http://librosweb.es/ajax/capitulo_4.html


ATENTAMENTE: THANAHI MEDRANO RUIZ Like a Star @ heaven




HOLA AMIGA RESPECTO A LA INFORMACION QUE NOS HAS PROPORCIONADO POR MEDIO DE ESTE FORO ES IMPORTANTE POR QUE NOS MENCIONA QUE ES DOM Y NOS MUESTRAS ALGUNOS EJEMPLOS DE COMO IMPLEMENTARLOS.

ATENTAMENTE: SINAI VARGAS GARCIA
sinay vargas
sinay vargas

Mensajes : 68
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty POSIBLE SOLUCION A LOS PUNTOS 1 Y 2

Mensaje por miguelTL Mar Mayo 13, 2014 2:47 pm

Conceptos básicos de RIA (RichInternet Applications)

http://www.slideshare.net/romualdovalenciadominguez/concepto-basico-de-ria-34636881

JavaScript Básico (conceptos,temas que refieren al nivel básico y ejemplo de programa)

http://www.slideshare.net/romualdovalenciadominguez/javascript-basico


INTEGRANTES:

MIGUEL ANGEL TORRES LEON
ROMUALDO VALENCIA DOMINGUEZ
miguelTL
miguelTL

Mensajes : 45
Fecha de inscripción : 29/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty RESPUESTA A LA PREGUNTA: Definición y un ejemplo de programa usando BOM (Browser Object Model)

Mensaje por addicto007 Jue Mayo 15, 2014 7:12 pm

CONCEPTO Y DEFINICION DE BOM:
BOM, permite acceder y modificar las propiedades de las ventanas del propio navegador.
Mediante BOM, es posible redimensionar y mover la ventana del navegador, modificar el texto que se muestra en la barra de estado y realizar muchas otras manipulaciones no relacionadas con el contenido de la página HTML.
El mayor inconveniente de BOM es que, al contrario de lo que sucede con DOM, ninguna entidad se encarga de estandarizarlo o definir unos mínimos de interoperabilidad entre navegadores.
Algunos de los elementos que forman el BOM son los siguientes:
 Crear, mover, redimensionar y cerrar ventanas de navegador.
 Obtener información sobre el propio navegador.
 Propiedades de la página actual y de la pantalla del usuario.
 Gestión de cookies.
 Objetos ActiveX en Internet Explorer.
El BOM está compuesto por varios objetos relacionados entre sí.
El objeto window representa la ventana completa del navegador. Mediante este objeto, es posible mover, redimensionar y manipular la ventana actual del navegador. Incluso es posible abrir y cerrar nuevas ventanas de navegador.
Como todos los demás objetos heredan directa o indirectamente del objeto window, no es necesario indicarlo de forma explícita en el código JavaScript. En otras palabras:
window.forms[0] === forms[0]
window.document === document

No existen normas oficiales para el Browser Object Model o (BOM).
Dado que los navegadores modernos han puesto en práctica (casi) los mismos métodos y propiedades para la interactividad con JavaScript, se refieren a menudo como los métodos y las propiedades de la lista de materiales.
La ventana de objeto es compatible con todos los navegadores. Se representa la ventana del navegador.
Todos los objetos globales de JavaScript, las funciones y las variables se convierten automáticamente en miembros del objeto ventana.
Las variables globales son propiedades del objeto ventana.
Funciones globales son métodos del objeto window.


EJEMPLO DE PROGRAMA USANDO BOM

<HTML>
<HEAD>
<TITLE>Abriendo y cerrando ventanas con Javascript</TITLE>
<SCRIPT>
<!--
var nuevaVentana;

function doble( x ) {
return 2*x;
}
function  nueva() {
nuevaVentana=nuevaVentana=window.open("", "segundaPag",
"toolbar=yes,location=no,menubar=yes,resizable=yes,"+
"width=30,height=30" );
nuevaVentana.document.write("<HTML><HEAD><TITLE>"+
"Sin Título</TITLE></HEAD>\n");
nuevaVentana.document.write("<BODY><form>\n");
nuevaVentana.document.write("<input type='button' "+
"value='Cerrar' onClick='window.close();'>\n");
nuevaVentana.document.write("</form>\n");
nuevaVentana.document.write("</BODY></HTML>\n");
nuevaVentana.document.close();
}
// -->
</SCRIPT>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="Abrir" onClick="nueva();"><br>
</FORM>
</BODY>
</HTML>


FUENTES DE INFORMACIÓN:

http://www.arkaitzgarro.com/javascript/capitulo-14.html
http://www.w3schools.com/js/js_window.asp
http://geneura.ugr.es/~victor/cursillos/javascript/js_window.html


ATT: MOISES ANGON TORRES

addicto007

Mensajes : 21
Fecha de inscripción : 29/01/2013
Edad : 31

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Re: 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por addicto007 Jue Mayo 15, 2014 7:15 pm

miguelTL escribió: Conceptos básicos de RIA (RichInternet Applications)

http://www.slideshare.net/romualdovalenciadominguez/concepto-basico-de-ria-34636881

JavaScript Básico (conceptos,temas que refieren al nivel básico y ejemplo de programa)

http://www.slideshare.net/romualdovalenciadominguez/javascript-basico


INTEGRANTES:

MIGUEL ANGEL TORRES LEON
ROMUALDO VALENCIA DOMINGUEZ


MUY BUENA INFORMACION, HAN DEFINIDO CON CLARIDAD Y ENTENDIMIENTO CADA UNO DE LOS CONCEPTOS.

ATT: MOISES ANGON TORRES

addicto007

Mensajes : 21
Fecha de inscripción : 29/01/2013
Edad : 31

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REPLICA A UN INCISO

Mensaje por CINTHIA CADENA PEREZ Vie Mayo 16, 2014 10:51 pm

ISAI RENDON QUITERIO1 escribió:5.- DEFINICIÓN Y UN EJEMPLO DE PROGRAMA USANDO BOM (BROWSER OBJECT MODEL)

¿QUÉ ES BOM?
BOM, permite acceder y modificar las propiedades de las ventanas del propio navegador.
Mediante BOM, es posible redimensionar y mover la ventana del navegador, modificar el texto que se muestra en la barra de estado y realizar muchas otras manipulaciones no relacionadas con el contenido de la página HTML.
El mayor inconveniente de BOM es que, al contrario de lo que sucede con DOM, ninguna entidad se encarga de estandarizarlo o definir unos mínimos de interoperabilidad entre navegadores.
Algunos de los elementos que forman el BOM son los siguientes:
 Crear, mover, redimensionar y cerrar ventanas de navegador.
 Obtener información sobre el propio navegador.
 Propiedades de la página actual y de la pantalla del usuario.
 Gestión de cookies.
 Objetos ActiveX en Internet Explorer.
El BOM está compuesto por varios objetos relacionados entre sí.
El objeto window representa la ventana completa del navegador. Mediante este objeto, es posible mover, redimensionar y manipular la ventana actual del navegador. Incluso es posible abrir y cerrar nuevas ventanas de navegador.
Como todos los demás objetos heredan directa o indirectamente del objeto window, no es necesario indicarlo de forma explícita en el código JavaScript. En otras palabras:
window.forms[0] === forms[0]
window.document === document

No existen normas oficiales para el Browser Object Model o (BOM).
Dado que los navegadores modernos han puesto en práctica (casi) los mismos métodos y propiedades para la interactividad con JavaScript, se refieren a menudo como los métodos y las propiedades de la lista de materiales.
La ventana de objeto es compatible con todos los navegadores. Se representa la ventana del navegador.
Todos los objetos globales de JavaScript, las funciones y las variables se convierten automáticamente en miembros del objeto ventana.
Las variables globales son propiedades del objeto ventana.
Funciones globales son métodos del objeto window.


EJEMPLO DE PROGRAMA USANDO BOM
<HTML>
<HEAD>
<TITLE>Abriendo y cerrando ventanas con Javascript</TITLE>
<SCRIPT>
<!--
var nuevaVentana;

function doble( x ) {
 return 2*x;
}
function  nueva() {
 nuevaVentana=nuevaVentana=window.open("", "segundaPag",
 "toolbar=yes,location=no,menubar=yes,resizable=yes,"+
 "width=30,height=30" );
 nuevaVentana.document.write("<HTML><HEAD><TITLE>"+
 "Sin Título</TITLE></HEAD>\n");
 nuevaVentana.document.write("<BODY><form>\n");
 nuevaVentana.document.write("<input type='button' "+
 "value='Cerrar' onClick='window.close();'>\n");
 nuevaVentana.document.write("</form>\n");
 nuevaVentana.document.write("</BODY></HTML>\n");
 nuevaVentana.document.close();
}
// -->
</SCRIPT>
<BODY>
<FORM>
 <INPUT TYPE="button" VALUE="Abrir" onClick="nueva();"><br>
</FORM>
</BODY>
</HTML>



FUENTES DE INFORMACIÓN:
http://www.arkaitzgarro.com/javascript/capitulo-14.html
http://www.w3schools.com/js/js_window.asp
http://geneura.ugr.es/~victor/cursillos/javascript/js_window.html


INTEGRANTES DEL EQUIPO:
ANGON TORRES MOISES
DELGADO GOMEZ PABLO
RENDON QUITERIO ISAI
TORRES LEON MIGUEL ANGEL
VALENCIA DOMINGUEZ ROMUALDO

MUY BUENA APORTACION COMPAÑERO TE FELICITO ATI Y ATUS COMPAÑEROS CCONCUERDO CON USTEDES EN LO QUE OPINAN SOBRE ESTE TEMA.

ATTE:CINTHIA CADENA PEREZ

CINTHIA CADENA PEREZ

Mensajes : 51
Fecha de inscripción : 01/02/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REPLICA AL INCISO Nº 2

Mensaje por CINTHIA CADENA PEREZ Vie Mayo 16, 2014 10:54 pm

sinay vargas escribió:JavaScript Básico (conceptos, temas que refieren al nivel básico y ejemplo de programa)

JAVASCRIPT
JavaScript es un lenguaje de programación utilizado para crear pequeños programas encargados de realizar acciones dentro del ámbito de una página web.
Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Con Javascript se puede crear efectos especiales en las páginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso, y tal vez el único, con que cuenta este lenguaje es el propio navegador.
En JavaScript básico se pueden encontrar los siguientes elementos:

 Variables
 Tipos de Variables
 Operadores
 Estructuras de control de flujo


Variables
Las variables en los lenguajes de programación siguen una lógica similar a las variables utilizadas en otros ámbitos como las matemáticas. Una variable es un elemento que se emplea para almacenar y hacer referencia a otro valor. Gracias a las variables es posible crear "programas genéricos", es decir, programas que funcionan siempre igual independientemente de los valores concretos utilizados.
Las variables en JavaScript se crean mediante la palabra reservada var. De esta forma, el ejemplo anterior se puede realizar en JavaScript de la siguiente manera:
var numero_1 = 3;
var numero_2 = 1;
var resultado = numero_1 + numero_2;


Tipos de Variables
Aunque todas las variables de JavaScript se crean de la misma forma (mediante la palabra reservada var), la forma en la que se les asigna un valor depende del tipo de valor que se quiere almacenar (números, textos, etc.)

Numéricas

Se utilizan para almacenar valores numéricos enteros (llamados integer en inglés) o decimales (llamados floaten inglés). En este caso, el valor se asigna indicando directamente el número entero o decimal. Los números decimales utilizan el carácter . (punto) en vez de , (coma) para separar la parte entera y la parte decimal:
var iva = 16;        // variable tipo entero
var total = 234.65;  // variable tipo decimal


Cadenas de texto

Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la variable, se encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final:
var mensaje = "Bienvenido a nuestro sitio web";
var nombreProducto = 'Producto ABC';
var letraSeleccionada = 'c';
En ocasiones, el texto que se almacena en las variables no es tan sencillo. Si por ejemplo el propio texto contiene comillas simples o dobles, la estrategia que se sigue es la de encerrar el texto con las comillas (simples o dobles) que no utilice el texto:
/* El contenido de texto1 tiene comillas simples, por lo que
   se encierra con comillas dobles */
var texto1 = "Una frase con 'comillas simples' dentro";

/* El contenido de texto2 tiene comillas dobles, por lo que
   se encierra con comillas simples */
var texto2 = 'Una frase con "comillas dobles" dentro';


Arrays

En ocasiones, a los arrays se les llama vectores, matrices e incluso arreglos. No obstante, el término array es el más utilizado y es una palabra comúnmente aceptada en el entorno de la programación.
Un array es una colección de variables, que pueden ser todas del mismo tipo o cada una de un tipo diferente. Su utilidad se comprende mejor con un ejemplo sencillo: si una aplicación necesita manejar los días de la semana, se podrían crear siete variables de tipo texto:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
Ahora, una única variable llamada dias almacena todos los valores relacionados entre sí, en este caso los días de la semana.


Booleanos
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo lógico. Aunque para entender realmente su utilidad se debe estudiar la programación avanzada con JavaScript del siguiente capítulo, su funcionamiento básico es muy sencillo.
Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true(verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto.
Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden utilizarse los valores verdadero y falso. A continuación se muestra un par de variables de tipo booleano:
var clienteRegistrado = false;
var ivaIncluido = true;



Operadores
Los operadores permiten manipular el valor de las variables, realizar operaciones matemáticas con sus valores y comparar diferentes variables. De esta forma, los operadores permiten a los programas realizar cálculos complejos y tomar decisiones lógicas en función de comparaciones y otros tipos de condiciones.




ASIGNACIÓN


El operador de asignación es el más utilizado y el más sencillo. Este operador se utiliza para guardar un valor específico en una variable. El símbolo utilizado es = (no confundir con el operador == que se verá más adelante):
var numero1 = 3;



Incremento y decremento


Estos dos operadores solamente son válidos para las variables numéricas y se utilizan para incrementar o decremento en una unidad el valor de una variable.
Ejemplo:
var numero = 5;
++numero;
alert(numero);  // numero = 6
El operador de incremento se indica mediante el prefijo ++ en el nombre de la variable. El resultado es que el valor de esa variable se incrementa en una unidad. Por tanto, el anterior ejemplo es equivalente a:
var numero = 5;
numero = numero + 1;
alert(numero);  // numero = 6



LÓGICOS

Los operadores lógicos son imprescindibles para realizar aplicaciones complejas, ya que se utilizan para tomar decisiones sobre las instrucciones que debería ejecutar el programa en función de ciertas condiciones.
El resultado de cualquier operación que utilice operadores lógicos siempre es un valor lógico o booleano.


NEGACIÓN

Uno de los operadores lógicos más utilizados es el de la negación. Se utiliza para obtener el valor contrario al valor de la variable:
var visible = true;
alert(!visible);  // Muestra "false" y no "true"


Estructuras de control de flujo
Las estructuras de control de flujo, que son instrucciones del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro". También existen instrucciones del tipo "repite esto mientras se cumpla esta condición".
Si se utilizan estructuras de control de flujo, los programas dejan de ser una sucesión lineal de instrucciones para convertirse en programas inteligentes que pueden tomar decisiones en función del valor de las variables.


Estructura if
La estructura más utilizada en JavaScript y en la mayoría de lenguajes de programación es la estructura if. Se emplea para tomar decisiones en función de una condición. Su definición formal es:
if(condicion) {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro de {...}. Si la condición no se cumple (es decir, si su valor es false) no se ejecuta ninguna instrucción contenida en {...} y el programa continúa ejecutando el resto de instrucciones del script.
Ejemplo:
var mostrarMensaje = true;

if(mostrarMensaje) {
 alert("Hola Mundo");
}
Estructura if...else
En ocasiones, las decisiones que se deben realizar no son del tipo "si se cumple la condición, hazlo; si no se cumple, no hagas nada". Normalmente las condiciones suelen ser del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro".
Para este segundo tipo de decisiones, existe una variante de la estructura if llamada if...else. Su definición formal es la siguiente:
if(condicion) {
 ...
}
else {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro del if(). Si la condición no se cumple (es decir, si su valor es false) se ejecutan todas las instrucciones contenidas en else { }. Ejemplo:
var edad = 18;

if(edad >= 18) {
 alert("Eres mayor de edad");
}
else {
 alert("Todavía eres menor de edad");
}
Si el valor de la variable edad es mayor o igual que el valor numérico 18, la condición del if() se cumple y por tanto, se ejecutan sus instrucciones y se muestra el mensaje "Eres mayor de edad". Sin embargo, cuando el valor de la variable edad no es igual o mayor que 18, la condición del if() no se cumple, por lo que automáticamente se ejecutan todas las instrucciones del bloque else { }. En este caso, se mostraría el mensaje "Todavía eres menor de edad".
El siguiente ejemplo compara variables de tipo cadena de texto:
var nombre = "";

if(nombre == "") {
 alert("Aún no nos has dicho tu nombre");
}
else {
 alert("Hemos guardado tu nombre");
}
Estructura for
Las estructuras if y if...else no son muy eficientes cuando se desea ejecutar de forma repetitiva una instrucción. Por ejemplo, si se quiere mostrar un mensaje cinco veces, se podría pensar en utilizar el siguienteif:
var veces = 0;

if(veces < 4) {
 alert("Mensaje");
 veces++;
}
Se comprueba si la variable veces es menor que 4. Si se cumple, se entra dentro del if(), se muestra el mensaje y se incrementa el valor de la variable veces. Así se debería seguir ejecutando hasta mostrar el mensaje las cinco veces deseadas.
Estructura for...in
Una estructura de control derivada de for es la estructura for...in. Su definición exacta implica el uso de objetos, que es un elemento de programación avanzada que no se va a estudiar. Por tanto, solamente se va a presentar la estructura for...in adaptada a su uso en arrays. Su definición formal adaptada a los arrays es:
for(indice in array) {
 ...
}
Si se quieren recorrer todos los elementos que forman un array, la estructura for...in es la forma más eficiente de hacerlo, como se muestra en el siguiente ejemplo:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

for(i in dias) {
 alert(dias[i]);
}
La variable que se indica como indice es la que se puede utilizar dentro del bucle for...in para acceder a los elementos del array. De esta forma, en la primera repetición del bucle la variable i vale 0 y en la última vale 6.
Esta estructura de control es la más adecuada para recorrer arrays (y objetos), ya que evita tener que indicar la inicialización y las condiciones del bucle for simple y funciona correctamente cualquiera que sea la longitud del array. De hecho, sigue funcionando igual aunque varíe el número de elementos del array.





PROGRAMA DE UN JAVASCRIPT BASICO
<head>
<title> Hola Mundo </title>
<script>
alert ('¡Hola mundo SIN!');
</script>
</head>
<body>
alert ('¡Hola mundo SIN!');
</body>
</html>


FUENTES DE INFORMACIÓN

http://www.desarrolloweb.com/articulos/25.php
http://librosweb.es/javascript/capitulo_3/variables.html
http://librosweb.es/javascript/capitulo_3/tipos_de_variables.html
http://librosweb.es/javascript/capitulo_3/operadores.html
http://librosweb.es/javascript/capitulo_3/estructuras_de_control_de_flujo.html


ATENTAMENTE:
SINAÍ VARGAS GARCÍA     lol! 

ASI ES AMIGA ESTOY DE ACUERDO SOBRE ESTE TEMA YA QUE YO TAMBIEN UDE AVERIGUAR TANTITO DE L MIMO Y OPINO LO MISMO QUE TU.

ATTE: CINTHIA CADENA PEREZ

CINTHIA CADENA PEREZ

Mensajes : 51
Fecha de inscripción : 01/02/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REPLICA A UN INCISO

Mensaje por CINTHIA CADENA PEREZ Vie Mayo 16, 2014 10:56 pm

addicto007 escribió:
CONCEPTO Y DEFINICION DE BOM:
BOM, permite acceder y modificar las propiedades de las ventanas del propio navegador.
Mediante BOM, es posible redimensionar y mover la ventana del navegador, modificar el texto que se muestra en la barra de estado y realizar muchas otras manipulaciones no relacionadas con el contenido de la página HTML.
El mayor inconveniente de BOM es que, al contrario de lo que sucede con DOM, ninguna entidad se encarga de estandarizarlo o definir unos mínimos de interoperabilidad entre navegadores.
Algunos de los elementos que forman el BOM son los siguientes:
 Crear, mover, redimensionar y cerrar ventanas de navegador.
 Obtener información sobre el propio navegador.
 Propiedades de la página actual y de la pantalla del usuario.
 Gestión de cookies.
 Objetos ActiveX en Internet Explorer.
El BOM está compuesto por varios objetos relacionados entre sí.
El objeto window representa la ventana completa del navegador. Mediante este objeto, es posible mover, redimensionar y manipular la ventana actual del navegador. Incluso es posible abrir y cerrar nuevas ventanas de navegador.
Como todos los demás objetos heredan directa o indirectamente del objeto window, no es necesario indicarlo de forma explícita en el código JavaScript. En otras palabras:
window.forms[0] === forms[0]
window.document === document

No existen normas oficiales para el Browser Object Model o (BOM).
Dado que los navegadores modernos han puesto en práctica (casi) los mismos métodos y propiedades para la interactividad con JavaScript, se refieren a menudo como los métodos y las propiedades de la lista de materiales.
La ventana de objeto es compatible con todos los navegadores. Se representa la ventana del navegador.
Todos los objetos globales de JavaScript, las funciones y las variables se convierten automáticamente en miembros del objeto ventana.
Las variables globales son propiedades del objeto ventana.
Funciones globales son métodos del objeto window.


EJEMPLO DE PROGRAMA USANDO BOM

<HTML>
<HEAD>
<TITLE>Abriendo y cerrando ventanas con Javascript</TITLE>
<SCRIPT>
<!--
var nuevaVentana;

function doble( x ) {
return 2*x;
}
function  nueva() {
nuevaVentana=nuevaVentana=window.open("", "segundaPag",
"toolbar=yes,location=no,menubar=yes,resizable=yes,"+
"width=30,height=30" );
nuevaVentana.document.write("<HTML><HEAD><TITLE>"+
"Sin Título</TITLE></HEAD>\n");
nuevaVentana.document.write("<BODY><form>\n");
nuevaVentana.document.write("<input type='button' "+
"value='Cerrar' onClick='window.close();'>\n");
nuevaVentana.document.write("</form>\n");
nuevaVentana.document.write("</BODY></HTML>\n");
nuevaVentana.document.close();
}
// -->
</SCRIPT>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="Abrir" onClick="nueva();"><br>
</FORM>
</BODY>
</HTML>


FUENTES DE INFORMACIÓN:

http://www.arkaitzgarro.com/javascript/capitulo-14.html
http://www.w3schools.com/js/js_window.asp
http://geneura.ugr.es/~victor/cursillos/javascript/js_window.html


ATT: MOISES ANGON TORRES

ME PARECE MUY INTERESANTE TU INFORMACION COMPAÑERO Y COMPARTO CONTIGO DIGHO CONCEPTO.

ATTE: CINTHIA CADENA PEREZ

CINTHIA CADENA PEREZ

Mensajes : 51
Fecha de inscripción : 01/02/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REPLICA A UN COMPAÑERO

Mensaje por thanahi Lun Mayo 19, 2014 11:40 pm

ISAI RENDON QUITERIO1 escribió:1.- CONCEPTOS BÁSICOS DE RIA (RICH INTERNET APPLICATIONS)
Las rich Internet applications, o RIA (en español "aplicaciones de Internet enriquecidas"), son aplicaciones web que tienen la mayoría de las características de las aplicaciones de escritorio tradicionales. Estas aplicaciones utilizan un navegador web estandarizado para ejecutarse y por medio de complementos o mediante una máquina virtual se agregan las características adicionales.
Las RIA son aplicaciones web con características de interfaz de usuario similares a las aplicaciones de escritorio.
Las RIA surgen como una combinación de las ventajas que ofrecen las aplicaciones web y las aplicaciones tradicionales.
Buscan mejorar la experiencia y productividad del usuario.


CARACTERÍSTICAS:
 Accesibilidad: AJAX en nativo en los navegadores web y es el único RIA framework que puede ser encontrado por los diferentes motores de búsqueda. Aunque Adobe Flash ha dado grandes pasos en esta dirección.
 Comunicaciones avanzadas: con servidores que soporten nuevas tecnologías se puede mejorar la experiencia del usuario al utilizar protocolos de red optimizados y entradas y salidas asíncronas. Se requiere de una conexión de banda ancha confiable.
 Complejidad: soluciones avanzadas puede ser más difíciles de diseñar, desarrollar, implementar y depurar que las aplicaciones web tradicionales.
 Consistencia: la interfaz de usuario y las experiencias pueden ser controlada por el sistema operativo, el monitoreo del rendimiento y diagnóstico de errores puede ser difícil.
 Instalación y mantenimiento: se requiere de la instalación de un plugin o una máquina virtual o sandbox, que generalmente es más rápida que la instalación de una aplicación tradicional y esta no se puede automatizar. Las actualizaciones son automáticas.
 Seguridad: se mejora la seguridad por medio de actualizaciones automáticas y sandbox. Pero las extensiones por sí mismas son sujetas a vulnerabilidades.
 Rendimiento: puede ser mejorado dependiendo de la aplicación y de las características de la red. Aplicaciones que pueden procesar localmente en el cliente evitan viajes hacia el servidor lo que incrementa su rendimiento. Dándole más trabajo al cliente también se puede incrementar el rendimiento del servidor. Por el contrario los recursos necesarios hacen difícil que las aplicaciones puedan ejecutarse en dispositivos pequeños, móviles o embebidos.
 Riqueza: añadiendo características que no son nativas en los navegadores web como captura de video.

PLATAFORMAS RIA
 AJAX
 Adobe Flash
 Adobe Flex
 Adobe AIR
 Silverlight
 JavaFX Script
 OpenLaszlo
 Bindows
 GWT
 ZK
 JavascriptMVC
 Javascript


VENTAJAS DE RIA
Ventajas respecto a aplicaciones de escritorio:
 Único punto de instalación y mantenimiento en el servidor web
 Los clientes no requieren de ninguna instalación
 Clientes siempre actualizados a la última versión, disponible en el servidor web
 Multiplataforma, accesible desde Windows, Linux, Mac OS

Ventajas respecto a aplicaciones web:
 Experiencia de usuario similar a aplicaciones de escritorio
 Desaparece problemática de incompatibilidad entre navegadores
 Reducción de carga del servidor al estar la capa de presentación en el cliente
 Potencia en Streaming de video


INCONVENIENTES
 Necesidad de instalar Plug-ins
 Necesidad de disponer de mayor potencia en los dispositivos cliente
 Riesgo de sobrecarga la interfaz de usuario por querer explotar las posibilidades de RIA
 Falta de profesionales con experiencia en RIA
 Problemas relativos a la accesibilidad de la aplicación
 Botones de atrás y refrescar


ARQUITECTURA
3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) <img src=" />


BENEFICIOS:
A pesar de que el desarrollo de aplicaciones multimedia para navegadores web está mucho más limitado y es más difícil que otro tipo de aplicaciones de escritorio, los esfuerzos se justifican por varios motivos:
 No necesitan instalación (solo es necesario mantener actualizado el navegador web).
 Las actualizaciones hacia nuevas versiones son automáticas.
 Se pueden utilizar desde cualquier ordenador con una conexión a Internet sin depender del sistema operativo que este utilice.
 Generalmente es menos probable la infección por virus, que utilizando por ejemplo programas ejecutables.
 Más capacidad de respuesta, ya que el usuario interactúa directamente con el servidor, sin necesidad de recargar la página.
 Ofrecen aplicaciones interactivas que no se pueden obtener utilizando solo HTML, incluyendo arrastrar y pegar, cálculos en el lado del cliente sin la necesidad de enviar la información al servidor.
 Evita la problemática del uso de diferentes navegadores al abstraerse de ellos a través de un framework.


FUENTES DE INFORMACIÓN
http://blog.portalsaas.com/que-es-ria-rich-internet-applications/
http://es.wikipedia.org/wiki/Rich_Internet_Applications
http://exa.unne.edu.ar/depar/areas/informatica/SistemasOperativos/TFLino.pdf
http://www.slideshare.net/lisepi09/rich-internet-applications-2615942



INTEGRANTES DEL EQUIPO:
ANGON TORRES MOISES
DELGADO GOMEZ PABLO
RENDON QUITERIO ISAI
TORRES LEON MIGUEL ANGEL
VALENCIA DOMINGUEZ ROMUALDO


Hola compañero la informacion proporciona al foro es muy interesante nos explicas de forma muy clara el concepto de RIA. Excelente aporte.

ATTE:THANAHI MEDRANO RUIZ Very Happy

thanahi

Mensajes : 52
Fecha de inscripción : 30/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty REPLICA A UNA COMPAÑERA REACTIVO 2

Mensaje por thanahi Lun Mayo 19, 2014 11:43 pm

sinay vargas escribió:JavaScript Básico (conceptos, temas que refieren al nivel básico y ejemplo de programa)

JAVASCRIPT
JavaScript es un lenguaje de programación utilizado para crear pequeños programas encargados de realizar acciones dentro del ámbito de una página web.
Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Con Javascript se puede crear efectos especiales en las páginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso, y tal vez el único, con que cuenta este lenguaje es el propio navegador.
En JavaScript básico se pueden encontrar los siguientes elementos:

 Variables
 Tipos de Variables
 Operadores
 Estructuras de control de flujo


Variables
Las variables en los lenguajes de programación siguen una lógica similar a las variables utilizadas en otros ámbitos como las matemáticas. Una variable es un elemento que se emplea para almacenar y hacer referencia a otro valor. Gracias a las variables es posible crear "programas genéricos", es decir, programas que funcionan siempre igual independientemente de los valores concretos utilizados.
Las variables en JavaScript se crean mediante la palabra reservada var. De esta forma, el ejemplo anterior se puede realizar en JavaScript de la siguiente manera:
var numero_1 = 3;
var numero_2 = 1;
var resultado = numero_1 + numero_2;


Tipos de Variables
Aunque todas las variables de JavaScript se crean de la misma forma (mediante la palabra reservada var), la forma en la que se les asigna un valor depende del tipo de valor que se quiere almacenar (números, textos, etc.)

Numéricas

Se utilizan para almacenar valores numéricos enteros (llamados integer en inglés) o decimales (llamados floaten inglés). En este caso, el valor se asigna indicando directamente el número entero o decimal. Los números decimales utilizan el carácter . (punto) en vez de , (coma) para separar la parte entera y la parte decimal:
var iva = 16;        // variable tipo entero
var total = 234.65;  // variable tipo decimal


Cadenas de texto

Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la variable, se encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final:
var mensaje = "Bienvenido a nuestro sitio web";
var nombreProducto = 'Producto ABC';
var letraSeleccionada = 'c';
En ocasiones, el texto que se almacena en las variables no es tan sencillo. Si por ejemplo el propio texto contiene comillas simples o dobles, la estrategia que se sigue es la de encerrar el texto con las comillas (simples o dobles) que no utilice el texto:
/* El contenido de texto1 tiene comillas simples, por lo que
   se encierra con comillas dobles */
var texto1 = "Una frase con 'comillas simples' dentro";

/* El contenido de texto2 tiene comillas dobles, por lo que
   se encierra con comillas simples */
var texto2 = 'Una frase con "comillas dobles" dentro';


Arrays

En ocasiones, a los arrays se les llama vectores, matrices e incluso arreglos. No obstante, el término array es el más utilizado y es una palabra comúnmente aceptada en el entorno de la programación.
Un array es una colección de variables, que pueden ser todas del mismo tipo o cada una de un tipo diferente. Su utilidad se comprende mejor con un ejemplo sencillo: si una aplicación necesita manejar los días de la semana, se podrían crear siete variables de tipo texto:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
Ahora, una única variable llamada dias almacena todos los valores relacionados entre sí, en este caso los días de la semana.


Booleanos
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo lógico. Aunque para entender realmente su utilidad se debe estudiar la programación avanzada con JavaScript del siguiente capítulo, su funcionamiento básico es muy sencillo.
Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true(verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto.
Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden utilizarse los valores verdadero y falso. A continuación se muestra un par de variables de tipo booleano:
var clienteRegistrado = false;
var ivaIncluido = true;



Operadores
Los operadores permiten manipular el valor de las variables, realizar operaciones matemáticas con sus valores y comparar diferentes variables. De esta forma, los operadores permiten a los programas realizar cálculos complejos y tomar decisiones lógicas en función de comparaciones y otros tipos de condiciones.




ASIGNACIÓN


El operador de asignación es el más utilizado y el más sencillo. Este operador se utiliza para guardar un valor específico en una variable. El símbolo utilizado es = (no confundir con el operador == que se verá más adelante):
var numero1 = 3;



Incremento y decremento


Estos dos operadores solamente son válidos para las variables numéricas y se utilizan para incrementar o decremento en una unidad el valor de una variable.
Ejemplo:
var numero = 5;
++numero;
alert(numero);  // numero = 6
El operador de incremento se indica mediante el prefijo ++ en el nombre de la variable. El resultado es que el valor de esa variable se incrementa en una unidad. Por tanto, el anterior ejemplo es equivalente a:
var numero = 5;
numero = numero + 1;
alert(numero);  // numero = 6



LÓGICOS

Los operadores lógicos son imprescindibles para realizar aplicaciones complejas, ya que se utilizan para tomar decisiones sobre las instrucciones que debería ejecutar el programa en función de ciertas condiciones.
El resultado de cualquier operación que utilice operadores lógicos siempre es un valor lógico o booleano.


NEGACIÓN

Uno de los operadores lógicos más utilizados es el de la negación. Se utiliza para obtener el valor contrario al valor de la variable:
var visible = true;
alert(!visible);  // Muestra "false" y no "true"


Estructuras de control de flujo
Las estructuras de control de flujo, que son instrucciones del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro". También existen instrucciones del tipo "repite esto mientras se cumpla esta condición".
Si se utilizan estructuras de control de flujo, los programas dejan de ser una sucesión lineal de instrucciones para convertirse en programas inteligentes que pueden tomar decisiones en función del valor de las variables.


Estructura if
La estructura más utilizada en JavaScript y en la mayoría de lenguajes de programación es la estructura if. Se emplea para tomar decisiones en función de una condición. Su definición formal es:
if(condicion) {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro de {...}. Si la condición no se cumple (es decir, si su valor es false) no se ejecuta ninguna instrucción contenida en {...} y el programa continúa ejecutando el resto de instrucciones del script.
Ejemplo:
var mostrarMensaje = true;

if(mostrarMensaje) {
 alert("Hola Mundo");
}
Estructura if...else
En ocasiones, las decisiones que se deben realizar no son del tipo "si se cumple la condición, hazlo; si no se cumple, no hagas nada". Normalmente las condiciones suelen ser del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro".
Para este segundo tipo de decisiones, existe una variante de la estructura if llamada if...else. Su definición formal es la siguiente:
if(condicion) {
 ...
}
else {
 ...
}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro del if(). Si la condición no se cumple (es decir, si su valor es false) se ejecutan todas las instrucciones contenidas en else { }. Ejemplo:
var edad = 18;

if(edad >= 18) {
 alert("Eres mayor de edad");
}
else {
 alert("Todavía eres menor de edad");
}
Si el valor de la variable edad es mayor o igual que el valor numérico 18, la condición del if() se cumple y por tanto, se ejecutan sus instrucciones y se muestra el mensaje "Eres mayor de edad". Sin embargo, cuando el valor de la variable edad no es igual o mayor que 18, la condición del if() no se cumple, por lo que automáticamente se ejecutan todas las instrucciones del bloque else { }. En este caso, se mostraría el mensaje "Todavía eres menor de edad".
El siguiente ejemplo compara variables de tipo cadena de texto:
var nombre = "";

if(nombre == "") {
 alert("Aún no nos has dicho tu nombre");
}
else {
 alert("Hemos guardado tu nombre");
}
Estructura for
Las estructuras if y if...else no son muy eficientes cuando se desea ejecutar de forma repetitiva una instrucción. Por ejemplo, si se quiere mostrar un mensaje cinco veces, se podría pensar en utilizar el siguienteif:
var veces = 0;

if(veces < 4) {
 alert("Mensaje");
 veces++;
}
Se comprueba si la variable veces es menor que 4. Si se cumple, se entra dentro del if(), se muestra el mensaje y se incrementa el valor de la variable veces. Así se debería seguir ejecutando hasta mostrar el mensaje las cinco veces deseadas.
Estructura for...in
Una estructura de control derivada de for es la estructura for...in. Su definición exacta implica el uso de objetos, que es un elemento de programación avanzada que no se va a estudiar. Por tanto, solamente se va a presentar la estructura for...in adaptada a su uso en arrays. Su definición formal adaptada a los arrays es:
for(indice in array) {
 ...
}
Si se quieren recorrer todos los elementos que forman un array, la estructura for...in es la forma más eficiente de hacerlo, como se muestra en el siguiente ejemplo:
var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

for(i in dias) {
 alert(dias[i]);
}
La variable que se indica como indice es la que se puede utilizar dentro del bucle for...in para acceder a los elementos del array. De esta forma, en la primera repetición del bucle la variable i vale 0 y en la última vale 6.
Esta estructura de control es la más adecuada para recorrer arrays (y objetos), ya que evita tener que indicar la inicialización y las condiciones del bucle for simple y funciona correctamente cualquiera que sea la longitud del array. De hecho, sigue funcionando igual aunque varíe el número de elementos del array.





PROGRAMA DE UN JAVASCRIPT BASICO
<head>
<title> Hola Mundo </title>
<script>
alert ('¡Hola mundo SIN!');
</script>
</head>
<body>
alert ('¡Hola mundo SIN!');
</body>
</html>


FUENTES DE INFORMACIÓN

http://www.desarrolloweb.com/articulos/25.php
http://librosweb.es/javascript/capitulo_3/variables.html
http://librosweb.es/javascript/capitulo_3/tipos_de_variables.html
http://librosweb.es/javascript/capitulo_3/operadores.html
http://librosweb.es/javascript/capitulo_3/estructuras_de_control_de_flujo.html


ATENTAMENTE:
SINAÍ VARGAS GARCÍA     lol! 


Hola amiga excelente aporte al foro explicas de manera clara todo lo referente al javascript basico, ya que nos explicas su estructura, todo lo que se puede implementar en el.

ATTE:  Smile THANAHI MEDRANO RUIZ

thanahi

Mensajes : 52
Fecha de inscripción : 30/01/2013

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Respuesta a: JavaScript Básico (conceptos, temas que refieren al nivel básico y ejemplo de programa)

Mensaje por Isidro Antonio Solano Mar Mayo 20, 2014 12:21 am

JavaScript (abreviado comúnmente "JS") es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define como orientado a objetos,3 basado en prototipos, imperativo, débilmente tipado y dinámico.

Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como parte de un navegador web permitiendo mejoras en la interfaz de usuario y páginas web dinámicas4 aunque existe una forma de JavaScript del lado del servidor (Server-side JavaScript o SSJS). Su uso en aplicaciones externas a la web, por ejemplo en documentos PDF, aplicaciones de escritorio (mayoritariamente widgets) es también significativo.

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.

Todos los navegadores modernos interpretan el código JavaScript integrado en las páginas web. Para interactuar con una página web se provee al lenguaje JavaScript de una implementación del Document Object Model (DOM).

Tradicionalmente se venía utilizando en páginas web HTML para realizar operaciones y únicamente en el marco de la aplicación cliente, sin acceso a funciones del servidor. JavaScript se interpreta en el agente de usuario, al mismo tiempo que las sentencias van descargándose junto con el código HTML.

Ejemplo:

Una función recursiva:

function factorial(n) {
   if (n === 0) {
       return 1;
   }
   return n * factorial(n - 1);
}

Bibliografia

http://es.wikipedia.org/wiki/JavaScript
Isidro Antonio Solano
Isidro Antonio Solano

Mensajes : 36
Fecha de inscripción : 06/02/2013
Edad : 31

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Re: 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por Isidro Antonio Solano Mar Mayo 20, 2014 12:25 am

miguelTL escribió: Conceptos básicos de RIA (RichInternet Applications)

http://www.slideshare.net/romualdovalenciadominguez/concepto-basico-de-ria-34636881

JavaScript Básico (conceptos,temas que refieren al nivel básico y ejemplo de programa)

http://www.slideshare.net/romualdovalenciadominguez/javascript-basico


INTEGRANTES:

MIGUEL ANGEL TORRES LEON
ROMUALDO VALENCIA DOMINGUEZ

solo queda decirle, bueno creo, solo que ahi biene otras cosas ademas de lo que se pide pero esta bien What a Face What a Face What a Face What a Face camaradas. What a Face What a Face What a Face What a Face What a Face What a Face What a Face 
Isidro Antonio Solano
Isidro Antonio Solano

Mensajes : 36
Fecha de inscripción : 06/02/2013
Edad : 31

Volver arriba Ir abajo

3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA) Empty Re: 3.- Tecnica De Desarrollo Web Para Crear Aplicaciones Interactivas (RIA)

Mensaje por Contenido patrocinado


Contenido patrocinado


Volver arriba Ir abajo

Página 1 de 2. 1, 2  Siguiente

Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.