Iver's web place

Life is a journey ... taken one shot at a time!

JavaScript

  • Aprendiendo lenguajes de programación

    Leyendo el blog de Carlos Madrigal encontré unas cuantas ligas interesantes para aprender: Espero les sirvan.
  • JavaScript y prototype

    Ya tiene tiempo que estoy trabajando con JavaScript y he tenido ganas de hacer un pequeño manual sobre como usar Prototype[1] y algunos ejemplos con este lenguaje tan versátil y poderoso en el ambiente web.
    Para aquellos que no saben que onda con JavaScript[2] les recomiendo se den una vuelta por la Wikipedia[3].
    En cuanto a prototype, existen muchos sitios[4] que usan este framework para que puedas ver lo que se puede construir y de manera elegante. Un ejemplo simple y poderoso se puede ver en la manipulación de Array, suponiendo que se tiene un arreglo con la notación siguiente:
      this.properties = {
             background          : '#6b79a5',
             textColor           : '#ffffff',
             fontWeight          : 'bold',
             borderColor         : '#1f669b'
          }
     
    Si quisiera igualar cada elemento del arreglo a otro elemento tendría que hacer algo como:
      var newOptionArray = new Array();
      for (var index in this.properties) {
        newOptionArray[index] = this.properties[index];
      }
     
    Para simplificar el uso común de este tipo de acciones existe una clase llamada Object que permite manipular una asignación como esta con tan solo la siguiente línea:
        Object.extend(newOptionArray, this.properties);
     
    Otra utilidad interesante que tiene prototype es el uso simplificado para el acceso a objetos y extensión del DOM, en esté tipo de utilidades están la notación $() y la $A(), la primera es llamada la piedra angular de prototype, a parte de poder usarlo como un alias del document.getElementById, también permite el uso de la referencia del objeto para hacer más flexible una función. Ejemplo de esto lo podemos ver con un código como el siguiente:
    function foo(element) {
        element = $(element);
        /*  rest of the function... */
    }
     
    De esta manera se puede pasar a la función el id del objeto a manipular o bien el objeto mismo y trabajar internamente al objeto sin tener que identificar nada más. Otro uso práctico de esta utilidad se puede ver de la siguiente manera:
    $('item1', 'item2', 'item3').invoke('hide');
     
    Con esto se pueden ocultar varios elementos en una sola instrucción, esto hace más legible el código. En cuanto a la siguiente utilidad $A(), tiene como uso principal el obtener un arreglo de objetos a partir de una colección que podría ser representada como tal:
       var paras = $A(document.getElementsByTagName('p'));
       paras.each(Element.hide);
       $(paras.last()).show();
     
    En el código anterior, aparte de obtener un arreglo a partir de todos los elementos de parrafo en un documento HTML, se puede recorrer cada elemento (paras.each) de manera simple e ir ocultando cada uno de ellos (Element.hide()). En el tercer renglon se obtiene el último elemento y se muestra.
    Espero poner más información al respecto poco a poco y principalmente enriquecer la información sobre como trabajar JavaScript orientado a objetos.
    [1] http://en.wikipedia.org/wiki/Prototype

    http://www.prototypejs.org/

    [2] http://es.wikipedia.org/wiki/Javascript

    [3] http://www.wikipedia.org/

    [4] http://www.prototypejs.org/real-world
  • Algo de JS

    Ahora que esta de moda en la oficina irse al billar y para no dejar de lado la programacion aqui un hibrido entre ambas cosas face-wink.png
    http://www.jimroos.com/2006/07/another-javascript-demo.html