Foros del Web » Programando para Internet » Javascript »

primicias de programacion (o "cual es la logica?")

Estas en el tema de primicias de programacion (o "cual es la logica?") en el foro de Javascript en Foros del Web. hola foro!!!! ya veran lo necesitado de ayuda que estoy!!!! bueno. Tengo entendido que la razon por la cual exiten lenguajes de alto nivel es ...
  #1 (permalink)  
Antiguo 26/01/2010, 15:40
 
Fecha de Ingreso: enero-2010
Mensajes: 53
Antigüedad: 14 años, 3 meses
Puntos: 2
primicias de programacion (o "cual es la logica?")

hola foro!!!!
ya veran lo necesitado de ayuda que estoy!!!!


bueno. Tengo entendido que la razon por la cual exiten lenguajes de alto nivel es para que su sintaxis se acerque a la sintaxis de los lenguajes humanos. Pues bien, si quiero asignar un alerta cuando el raton pase sobre una imagen, mi razonamiento seria este: "si el raton llegara a pasar sobre la imagen, muestra al usuario un alerta". Bueno, yo lo haria asi: if(onmouseover) {alert("lo que sea");}. Sin embargo me encuentro con estos engendros de la sintaxis:


1)-bueno, entiendo la necesidad de recurrir al arbol jerarquico de nodos del DOM. Como quiera, obtengo una instruccion sencilla y funcional.

document.getElementById("foto").onmouseover = alerta;



2)-lo que no entiendo es que si con la sintaxis anterior obtengo un codigo no obtrusivo y funcional, a que viene esto? si la idea es no tocar el marcado, pues con lo anterior ya lo logre. O es que 'addEventListener' tiene un secretillo bajo la manga que lo hace diferente? me refiero a esto:

document.getElementById('travieso').addEventListen er('mouseover', funcion, false);



3)-este es el que me deja mas azorado. Simplemente no entiendo de que se trata. En el primer caso, el evento, al ser una propiedad, es decir, una variable de un objeto, lo tratamos como si fuera una variable. Y lo que yo entiendo por variable es que tiene un simbolo de igual en el medio! por lo tanto, y a juzgar por el signo de igual en el medio, se trata de una variable. . . . aunque no lo concibo de esa manera. De ser asi, seria como una variable dentro de otra variable. . . . . . que car*j*!!!!!!. Y Ademas, desde cuando document es un array?????

onmouseover = "window.document["foto"].src = uno.src";



4)-y finalmente este. Lo interpreto asi: si se cumple la escucha (esto esta raro?!) entonces al terminar de cargar la pagina lanzo la funcion. Bueno. No tiene sentido, y sospecho de que en realidad de lo que se trata es de que si fuera internet explorer, donde imagino, no debe existir soporte a esto, la instruccion se ignora. Pero en los demas exploradores se lanza la funcion. JEJE!!! solo estoy especulando y tratando de entender la logica. Pero aun asi, no veo sentido a una sintaxis tan larga teniendo a mano la primera, mucho mas simple.

if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", funcion, false);
}


bueno. . . . en realidad lo que necesito es entender las diferencias, por que una manera es preferible a la otra. Y por dios, que hay con la tercer sintaxis? trato de atrapar la logica, de pensar como programador. Pero no esta muy claro. Y algo me dice que cuando lo entienda, despego!

gracias, y disculpen la chachara interminable! y si no es pedir mucho, como quedaria mi instruccion utilizando eventos dentro de una estructura de control de flujos, como la que propongo al comenzar este enredo??
  #2 (permalink)  
Antiguo 26/01/2010, 16:43
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 15 años
Puntos: 1485
Respuesta: primicias de programacion (o "cual es la logica?")

Cita:
Tengo entendido que la razon por la cual exiten lenguajes de alto nivel es para que su sintaxis se acerque a la sintaxis de los lenguajes humanos.
opino diferente. en el sentido mas general del termino alto nivel, significa el nivel de abstraccion de un lenguaje con el hardware que lo soporta. en otras palabras se refiere a la posibilidad de portabilidad de un lenguaje a diferentes equipos y/o sistemas operativos. por tanto, no creo que la sintaxis del lenguaje tenga alguna relacion con el nivel de abstraccion. mirate por ejemplo Objective Caml es un lenguaje de alto nivel y su sintaxis es bien distinta a la de javascirpt.

respecto a tu primer y segundo punto, sucede que el DOM va evolucionando. la diferencia del primer y segundo ejemplo es el modelo que se emplea aunque parezcan realizar lo mismo. sin embargo, en el caso de addEventListener tienes un control que con DOM Level 0 (onclick, onmouseover, onmouseout, onkeyup, etc...) no tienes. definir en que fase capturar el evento: bubble o capture. por otro lado, y mas importante aun, addEventListener te permite definir eventos que no existen en DOM Level 0. probablemente lo que se te quiso explicar (en la literatura que probablmente estas leyendo) son dos modos en que se lograr separar los script de los elementos.

el tercer punto. realmente las propiedades no son variables, simplemente es una entidad que esta ligado a un objeto. en cambio, una variable es una memoria que almacena un valor temporalmente o permanentemente. por supuesto, mientras la aplicacion este activo. ahora bien, en javascript, hasta cierto punto ese principio se puede torcer pero esto se debe a las caracterisitcas del propio lenguaje. en javascript, si una variable se define como global, esta pasa a ser una propiedad del objeto window. pero cuando es una variable local de una funcion, es simplemente una variable temporera que se destruye (si no ocurre un closure) cuando la funcion termina la ejecucion.

respecto a document ser un array, pues no lo es pese a la sintaxis que demuestra parecerlo. lo que sucede que javascript te permite dos formas de acceso a las propiedades: por el operador punto (.), y por corchetes ([]). ambas son igual de validas. la diferencia es lo que puedes lograr hacer con una que de lo contrario es imposible. en la de corchete tu puedes escribir practicamente cualquier expresion que evalue a un nombre de la propiedad. incluso, este nombre puede ser compuesto por caracteres que no son legales para los identificadores.

cuarto punto. lo has interpretado bien, se verifica si dicha funcion existe antes de utilizarla. como te explique antes, addEventListener define otros eventos que no existen en el modelo DOM Level 0. desgraciadamente iexplorer es un navegador que no tiene soporte para el modelo DOM Event Level 2.

y finalmente, ¿cual utilizar? en mi opinion puedes utilizar con el que te sientas mas comodo. ambos son validos, solo que si utilizas addEventListener tambien tienes que considerar el equivalente de iexplorer: attachEvent. y hasta donde mi conocimiento alcanza, attachEvent solo tiene soporte para los eventos DOM Level 0.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #3 (permalink)  
Antiguo 26/01/2010, 17:22
 
Fecha de Ingreso: enero-2010
Mensajes: 53
Antigüedad: 14 años, 3 meses
Puntos: 2
Respuesta: primicias de programacion (o "cual es la logica?")

uau. . . gracias, no se pudo ser mas claro. Con eso tuve mi respuesta. Y añado algo mas, por si pasa desapercibido para algun novato distraido como yo. Se trata de la tercer sintaxis:

onmouseover = "window.document["foto"].src = uno.src";

mi confusion nace a partir de mi epico intento de estudiar la programacion separando las capas de contenido y de comportamiento (esto es, en un archivo programo html y en otro javascript) tal como indican las recomendaciones. Digo epico por que todos los manuales que he encontrado, apesar de coincidir que es mas profesional separar los contenidos del script, brindan ejemplos y ejercicios en los que los script estan embebidos en el marcado html (no se si ese es el termino correcto). Esto me obliga a ir tratando de adaptar los ejercicios. Lo que pase por alto, es que esta sintaxis en cuestion es la propia de un atributo html:
<a href="ruta_del_enlace"
onmouseover="window.document['imagen1'].src = iluminada.src"
onmouseout="window.document['imagen1'].src = apagada.src"></a>
y ahora que me doy cuenta, todo vuelve a su sitio. Por cierto, zerokilled, el recorrido historico realmente estuvo esclarecedor.

Etiquetas: programacion
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:25.