Adoptar las buenas prácticas

1. Aspectos básicos

Al desarrollar, siempre evitaremos exponer demasiadas funciones o variables en el espacio de nombres global, para evitar conflictos de nombres. Esto significa dar acceso solo a lo que es útil y ocultar todo lo demás. Es parecido al principio de una caja negra con entradas y salidas bien definidas, pero la mecánica interna permanece oculta.

Esto es aún más importante si es probable que el código se utilice en otros contextos. El problema es que estamos acostumbrados a agregar funciones a nuestros archivos, sin considerar la reutilización. A medida que nuestro proyecto se vuelve más sustancial, se hace cada vez más difícil de gestionar. La asociación de dos códigos puede causar conflictos que no son necesariamente visibles inicialmente y el resultado se vuelve incierto.

Para limitar las colisiones de nombres, agregaremos un contexto adicional (una especie de super contexto), que asegurará que nuestras funciones y variables no se puedan alterar/usar accidentalmente. Este espacio de nombres es una especie de contenedor de nombres. De esta manera, un nombre solo tiene significado en relación con su espacio de nombres. Por lo tanto, la invocación de una función que no está en el espacio de nombres esperado, no es posible.

Como cada código tiene su propio espacio de nombres, ya no existe ningún riesgo de colisiones asociado con el código que pertenece a otro espacio de nombres.

Un espacio de nombres es una posibilidad asociada con muchos lenguajes. En el lenguaje Java, por ejemplo, la palabra clave package sirve para para realizar la declaración, de manera similar a como se hace en C# con namespace. En JavaScript, lamentablemente no tenemos una palabra clave para este uso, pero tenemos otros trucos igualmente poderosos para conseguirlo.

Este principio es importante para la calidad de sus programas. Una vez que lo entienda, se volverá natural y su desarrollo mejorará aún más.

Cuanto más grande sea su programa, más espacios de nombres necesitará. Es la dimensión que impone su uso. Por tanto, tener en cuenta el espacio de nombres será la garantía de un código de mejor calidad, que podrá evolucionar de forma más sencilla y con más seguridad.

2. Función

1. Presentación

El concepto de módulo se deriva de la estructura anterior. La idea es ofrecer un formato universal para las piezas funcionales. Un módulo representa una parte independiente de nuestro código. Por ejemplo, podríamos tener un módulo encargado de un tipo de cálculo o un módulo que representa un componente gráfico. Un módulo no se debe confundir con una función; está por encima de la función y oculta todas las funciones y propiedades útiles para la prestación de un servicio.

Anteriormente hemos visto que la función puede servir como un espacio de nombres, que protege frente a conflictos a ciertos métodos o variables de nuestro código. Esto condujo al diseño de nuestro módulo:

function miModulo {  
   // Definición privada 
   variables ... 
   funciones ... 
 
   return {  
      // Definición pública 
      propiedades... 
      métodos... 
   } 
} 

Esta estructura se puede usar en cualquier lugar e incluso reemplaza a nuestras clases. También podemos devolver un único objeto, un constructor o una función.

Si por ejemplo desea obtener varias instancias, en este caso necesita un constructor que se encargará de generar las instancias bajo demanda:

function miModulo { 
   // Definición privada 
   variables para todas las instancias. 
   funciones ... 
 
  // Constructor intermediario para cada instancia 
  return function() {  
    return {  
      // Definición...

1. Presentación

Si queremos hacer un módulo más accesible y, por lo tanto, fácilmente explotable por todos, debemos cumplir con un estándar. De ahí el uso de soluciones como las que ofrece CommonJS (http://www.commonjs.org/). CommonJS nació en 2009 bajo el liderazgo de Kevin Dangoor, con la idea de poder estandarizar ciertas API de JavaScript. Como hemos visto hasta ahora, JavaScript ofrece una gran expresividad en la codificación, lo cual es agradable pero también esconde un problema real de estandarización e interoperabilidad.

2. define

Si miramos la definición de un módulo, se define según CommonJS como:

define( id?, dependencies?, factory); 

define es una función ofrecida por la API compatible con CommonJS, que se utiliza para describir un módulo. Los parámetros de esta función (hay un signo de interrogación para un parámetro opcional) son:

Tenga en cuenta que hay tres dependencias que se pueden utilizar...

1. Introducción

1. Función alert

for ( var i = 10; i >= 0; i -- ) { 
  alert( i ); 
} 

b. Simplificación

Podemos aligerar estas invocaciones de la siguiente manera:

var tmp = "" 
for ( var i = 10; i >= 0; i -- ) { 
  tmp += " i = " + i + "\n"; 
} 
alert( tmp ); 

Hemos indicado correctamente la variable i y solo tenemos una única visualización.

El inconveniente sigue siendo una cuestión de cantidad: después de un cierto número de iteraciones, la altura de la ventana hace que todo sea inmanejable.

(function( window ) { 
   var trace = ""; 
   window.trace = function( msg ) { 
     trace += msg + "\n"; 
   } 
   window.traceRes = function() { 
     if ( trace ) 
       alert( trace ); 
     trace = ""; 
   } 
} )( window ); 
 
// La forma de usarlo se convierte en: 
 
for ( var i = 10; i >= 0; i -- ) {  
 trace( " i = " + i ); ...