> Manuales > Manual de Mootools

Hash de Mootools nos ofrece funcionalidades muy útiles para acceso a propiedades y métodos de objetos, para analizar objetos y recorrer todas sus propiedades o iterar con sus elementos.

Mootools tiene lo que se llaman las extensiones nativas (native), que implementan nuevas funcionalidades en objetos nativos de Javascript. En este artículo del Manual de Mootools explicaremos las mejoras de Hash Native, que sin duda algún día os servirá de utilidad.

Los objetos de Mootools son muy útiles y hemos visto que este framework Javascript mejora muchos mecanismos de Javascript para trabajar con ellos, como crear clases, instanciar objetos con constructores, etc. Pero hay algunas cosas que como programadores podríamos necesitar hacer con ellos, pero que no están soportadas en un principio en los objetos normales. Por ejemplo, ¿Cómo podríamos hacer una función que recorriese todas las propiedades de un objeto, sin saber a priori cuántas y que nombres tienen? La respuesta pasa por utilizar Native Hash.

Las librerías Native Hash de Mootools proporcionan una manera adicional, con ayudas para acceder al contenido de los objetos. Para poner en marcha Hash en Mootools necesitamos utilizar el constructor de la clase Hash, al que le pasaremos un objeto. Este constructor nos devolverá un objeto de la clase Hash creado a partir del objeto normal que hemos pasado al constructor.

Este objeto Hash es como un mapa del propio objeto (tabla hash), que dispone además de diversos métodos como por ejemplo set() o get(), que sirven para editar o recibir el valor de una propiedad pasada por parámetro. Otro ejemplo de método interesante es each(), que funciona de manera parecida al each de Arrays, pero para recorrer todas las propiedades de un objeto y obtener tanto el nombre de la propiedad como el valor.

Ahora vamos a ver un par de ejemplos simples en Mootools para utilizar las librerías Native Hash.

Métodos Set() y Get() de Hash

Vamos a crear un objeto Hash y a partir de él accederemos a sus métodos set() y get().

El método set() sirve para crear nuevas propiedades o métodos, o bien actualizar el valor de propiedades o métodos existentes. A set() tenemos que pasarle como parámetros el nombre del método o propiedad y el valor que queremos introducir. Por su parte, el método get() sirve para obtener el valor de una propiedad o método, que recibe simplemente como parámetro el nombre de la propiedad o método que queremos acceder.

Para definir un objeto Hash tenemos que utilizar el constructor de la clase, pasando como parámetro el objeto que queremos convertir en Hash.

//defino un objeto hash
miHash = new Hash({
   "pera": "verde",
   "uva": "morada"
});

Una vez que tenemos nuestro objeto Hash, podemos utilizar sobre él los métodos set() y get(), de la siguiente forma.

//obtengo el valor de la propiedad "pera"
alert(miHash.get("pera"));

Utilizando el método get() obtenemos en este caso el valor de la propiedad "pera", que en el objeto Hash creado anteriormente, vimos que era "verde".

Ahora veamos cómo utilizar set() para crear una nueva propiedad en el objeto Hash.

//creo una propiedad "tomate" con valor "rojo"
miHash.set("tomate", "rojo");

Con esto crearíamos una propiedad con nombre "tomate" y valor "rojo".

Ahora podríamos ver el valor de la propiedad "tomate" con la sentencia:

//obtengo el valor de la propiedad "tomate"
alert(miHash.get("tomate"));

Podemos ver este script en marcha en una página aparte.

Acceder a todos los métodos y propiedades de un objeto con Native Hash

Como segundo ejemplo de Hash veremos cómo hacer un bucle con el método each para recorrer todos los elementos de un objeto, sin necesidad de conocer los nombres de los métodos y propiedades que contiene. Esta tarea puede ser bastante útil para recorrer todos los elementos de cualquier objeto en Mootools y no conozco otra manera de hacerlo si no es por Hash.

El método each de Hash es muy parecido al each de Array, con la única diferencia que each en Hash recibe una función con un parámetro adicional. El esquema de uso de each es el siguiente:

each(function (valor, clave, esteHash){
   //codigo de la función
}, bind);

Normalmente, para realizar una iteración con each, tal como se explicó para los Arrays, tenemos que especificar una función. Ésta recibe los parámetros: valor (value) y clave (key) del elemento actual de la iteración, más un parámetro adicional en el caso del each sobre objetos Hash, que es el propio objeto Hash que recibe el método.

Además, en caso que lo necesitemos, al método each también podemos pasarle una variable "bind", que es el valor que tendrá this dentro del código de la función.

Ahora veamos el código del ejemplo:

//defino un objeto cualquiera
var enlace= new Element("a", {"html": "texto enlace", "href": "http://www.desarrolloweb.com"});

//creo un hash de ese objeto
miHash = new Hash(enlace);

//hago un recorrido de todas sus propiedades y métodos
miHash.each(function (valor, clave, esteHash){
   //para cada elemento del objeto, muestro el nombre y el contenido
   document.write(clave + ": " + valor + "<br>");
});

Como se puede ver, he creado un objeto cualquiera. Para hacer mis pruebas y por hacer algo distinto, he optado por construir un objeto de la clase Element de Mootools, que tiene un buen número de métodos y propiedades para listar.

Luego he creado un objeto Hash a partir del objeto Element, utilizando el constructor de Hash y pasándole como parámetro el objeto de la clase Element creado en el anterior paso.

Por último he realizado el recorrido con each a todos los métodos y propiedades del objeto. En cada iteración de each simplemente escribo en la página el nombre de la clave y el valor que contiene.

Puedes ver este ejemplo en marcha en una página aparte.

Las librerías Native Hash tienen algunas otras utilidades para acceder y analizar objetos de manera avanzada. Nosotros hemos visto sólo un par de ejemplos sencillos, pero al menos ya sabemos que Hash tiene algunas utilidades para trabajo con objetos que pueden venirnos bien en algún momento.

Miguel Angel Alvarez

Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...

Manual