Describir el funcionamiento del patrón modulo en javascript.
El patrón módulo puede ser implementado en diferentes lenguajes, pero en Javascript se puede ver su utilidad en su máxima expresión. Su estructura básica es sencilla: se trata de una función que actúa como contenedor para un contexto de ejecución. Esto quiere decir que en su interior, se declaran una serie de variables y funciones que sólo son visibles dentro del mismo. Muy útil para generar componentes re-utilizables y sobre todo modulares.
- JavaScript - JavaScript is a dynamic computer programming language. It is most commonly used as part of web browsers, whose implementations allow client-side scripts to interact with the user.
Paso 1: Identificando componentes.
-
Funcion autoejecutable
Primeramente se busca que el módulo sea auto ejecutable o que se tenga control de su instancia. -
Variables públicas & privadas
Una de las cualidades de este patrón es que se pueden hacer variables públicas y privadas, que nos permite la simulación de orientación a objetos por medio de clases. -
Publicación de funciones
En esta parte se decide qué variables y funciones se ejecutan bajo qué contexto.
Paso 2: Función auto ejecutable.
Una función auto ejecutable nos permite darle un contexto de ejecución a un bloque de código pero también nos permite tener control de cuando se inicializa todo el módulo y sus funciones.
La definición de la función contexto del módulo es de la siguiente forma:
(function(){
// Code goes here...
}());Paso 3: Variables y funciones.
La definición de las variables y funciones se hacen de la forma común de javascript, un ejemplo de ello podría ser lo siguiente:
( function(){
var foo = 'Module Pattern';
var bar = 'ver 1.0';
var sum = function( param1, param2 ){
return param1 + param2;
}
})();Paso 4: Publicar variables y funciones.
Todas las funciones por defecto son privadas si están dentro del contexto del módulo, para hacerlas públicas se tendrán que retornar, y de esta forma la variable que esté instanciando el módulo tendrá acceso a las variables o funciones, esto puede quedar de la siguiente forma:
var myApp = ( function(){
var foo = 'Module Pattern';
var bar = 'ver 1.0';
var sum = function( param1, param2 ){
return param1 + param2;
}
var sub = function( param1, param2 ){
return param1 - param2;
}
return {
sum: sum,
foo: foo
}
})();
console.log( myApp.foo ); // Module Pattern ver 1.0
console.log( myApp.sum( 10, 5 ) ); // Result 15- Nota
- Si intentas llamar a la función sub que no es publica obtendrás un undefined.
- Learning JavaScript Design Patterns by Addy Osmani:
- Autor del snippet: Mario Andrade @TheVansters
- Los snippets pertenecen a KamikazeLab