Patrón fachada en JavaScript (Facade)

Es uno de los patrones más comunes en todo tipo de sistemas. Se utiliza para simplificar una interfaz compleja y reducirla a las funciones necesarias en nuestro sistema o a funciones mejor diseñadas y más simples que las originales. También puede utilizarse para desacoplar un sistema de un subsistema/componente concreto.

La librería jQuery proporciona ejemplos muy bien diseñados de este patrón. El más conocido y más utilizado es el selector de elementos del DOM: $("selector").

Hasta que el W3C definió el Selectors API Level 1, encontrar elementos concretos en el DOM era bastante engorroso si no tenian una id asignada. Por ejemplo, algo tan común como seleccionar todos los elementos que tengan la clase 'example' requería:

• Seleccionar todos los elementos de la página con getElementsByTagName('*')
• Iterar sobre los elementos comparando sus clases con la clase que buscamos
• Tener en cuenta que puede haber una lista de clases separadas por espacios

La cosa se complica mucho si queremos buscar algo más complejo, como todos los elementos con clase 'example' que son hijos de un elemento ul con clase 'offer'.

jQuery ha abstraido toda esta complejidad del API del DOM en una fachada de uso simple e intuitivo: $("selector"). Podemos escribir simplemente:

$('.example')

$('ul.offer .example')

El uso es sencillo y elegante. De echo, el excelente diseño de las fachadas que proporciona jQuery es la razón principal de su éxito.

El excelente diseño de las fachadas que proporciona jQuery es la razón principal de su éxito

Como comentamos antes, también puede utilizarse para desacoplar un subsistema/componente/librería que utilizamos, reduciendo nuestra dependencia. En este caso se crea la fachada como un intermediario. Nuestro sistema realiza todas las llamadas a nuestra fachada y es la fachada la única que utiliza el componente específico.

De esta forma, si en el futuro dedicimos utilizar otro componente que provea esa funcionalidad, sólo tenemos que cambiar la parte de nuestra fachada que interactua con él. El interfaz que se ofrece hacia nuestro sistema no se modifica. De hecho, el sistema no necesita conocer nada del componente, sólo conoce el API que ofrece la fachada.