E4X:El nuevo enfoque XML para AS3.0

La nueva especificación de Ecmascript introduce por primera vez herramientas para trabajar de forma nativa y standard con datos XML. Este conjunto de herramientas o core clases se conoce como E4X o EcmaScript for XML.

Por su naturaleza, el formato XML se ha convertido en un standard, tanto para la definición, como para el intercambio de datos: RSS, Web services, Base de datos, ficheros de configuración, etc

Como desarrolladores RIA, es imperativo tener soltura y experiencia en el manejo de este tipo de datos y es objetivo de este tutorial el abordar, de la forma más práctica posible, su uso dentro de Actionscript 3.0 y Flex 2.0.

También quiero resaltar que este tutorial está centrado en este nuevo enfoque que ofrece E4X para XML y no en soluciones anteriores para trabajar con este tipo de datos.

Definir datos XML

Hay diferentes formas de definir objetos XML en AS 3.0:

  1. Definición directa
  2. Generación mediante constructores: appendchild, suma de listas, a partir
    de Strings, etc
  3. Carga desde un fichero externo
  4. Los datos vienen de un servicio remoto: web service, remote object, http service, etc

El objetivo de este tutorial no es el de estudiar las diferentes formas de definir estos objetos sino ver cómo se trabajan los datos XML con E4X; así que optaremos por una definición directa de un ejemplo sencillo sobre el que trabajaremos a lo largo del tutorial.

Utilizamos la clase XML para definir un objeto XML a partir de un XML literal:

Que sería lo mismo que cargar esos mismos datos desde un fichero XML externo:

Acceder a los datos XML

Utilizaremos los operadores de las clases XML y XMLList para acceder a los elementos del objeto XML:

El operador “.” se refiere a hijos directos y el operador “..” a descendientes a cualquier profundidad y ambos siempre retornan un objeto XMLList.

myXml..libros nos devolverá:

Extendiendo un poco más la consulta, podemos utilizar el símbolo “@” para acceder a los atributos de los elementos y utilizar expresiones condicionales entre paréntesis:

myXml..libro.( @id_producto < 106 ) devuelve:

Notad que el Flash Player mostraría un error si alguno de los libros no tuviera definido alguno de los atributos que utilizamos en comparaciones como, en este caso, “id_producto”. Para esquivar esto, debemos asegurarnos antes que el atributo existe (con libro.attribute( “id_producto”) != undefined en cualquier bucle que recorra la estructura).

Rizando el rizo podemos hasta utilizar expresiones regulares para seleccionar ciertos elementos del objeto XML:

Eg: Cuánto me costarían todos los libros que traten de cocina cuyo precio sea menor de 40?

Modificar datos XML

Además de consultar y recorrer el objeto XML también podemos alterarlo como queramos. Para insertar o eliminar un nodo de objeto XML primero hemos de localizar exactamente el punto de actuación, en este caso un nodo de referencia para insertar delante o detrás y un XML padre para este tipo de nodos dentro de nuestro XML global.

Por ejemplo, si queremos insertar un nodo libro después del libro con id_producto=106:

De igual forma existen métodos:

  • insertChildBefore (antes del nodo de referencia)
  • prependChild (al principio del bloque XML que especifiquemos)
  • appendChild (al final del XML que especifiquemos)

Vincular XML a componentes Flex

Como cualquier otro proveedor de datos (data provider), los objetos XML pueden ser vinculados a componentes visuales de Flex como DataGrid, List, Repeater, etc

Como ejemplo, vinculemos los libros de nuestro objeto XML a un Datagrid:

Conclusión

En este artículo hemos analizado las mejoras que la nueva especificación de Ecmascript ha incluido para el manejo de datos XML y que llevan como nombre E4X. Hemos repasado de forma práctica ejemplos para definir, modificar y utilizar estos datos dentro de ActionScript 3.0 y Flex 2.0. Lo interesante de este artículo es comprender el potencial que ofrece E4X y el uso de XML en cuanto a facilidad y rendimiento en comparación a recorrer, analizar o utilizar otro tipo de estructuras de datos con otro tipo de mecanismos.

Personalmente, trabajar con XML, E4X y Flex 2.0 me ha permitido, no sólo beneficiarme de todo eso a nivel abstracto ( o de datos ), sino a nivel visual, dándome la oportunidad de definir dinámicamente vistas, formularios, menús, etc. Espero poder tratar más en detalle estos temas en un futuro próximo.

Como apoyo a este tutorial, adjunto un fichero MXML donde se plasman la mayor parte de los ejemplos. Necesitaréis configurar el logger del flash player para ver la salida de los trace:

Comparte:



5votos  Vota!!

Acerca de esta entrada