¿Es este un buen patrón para mis scripts jQuery?

Question

quiero mantener mis guiones organizados en un solo archivo .js para todos mi sitio (Tengo un desastre en este momento), algo así como espacios de nombres y clases en C# ...

(function ($) { 

    //private variables 
    $.divref = $("#divReference"); 

    //Namespaces 
    window.MySite = {}; 
    window.MySite.Home = {}; 
    window.MySite.Contact = {}; 

    //Public function/method 
    window.MySite.Home.Init = function(params){ 
     alert("Init"); 

     MySite.Home.PrivateFunction(); 

     $.divref.click(function(){ 
      alert("click"); 
     }); 
    }; 

    //private function/method 
    MySite.Home.PrivateFunction = function(){ 
     alert("Private"); 
    }; 

})(jQuery); 

esto es correcto? ¿O hay un mejor camino? Soy algo nuevo en jQuery y JScript. Gracias por su tiempo y respuestas.

Answer 1

Esto es más cómo iba a aplicar el patrón que está tratando de hacer:

// MySite.Home Extension 
window.MySite = 
    (function ($, root) { 

     //private variables 
     var $divref = $("#divReference"); 

     //private function/method 
     var privateFunction = function(){ 
      alert("Private"); 
     };   

     root.Home = {}; 

     // Public variable 
     root.Home.prop = "Click" 

     //Public function/method 
     root.Home.Init = function(params){ 
      alert("Init"); 

      private(); 

      $divref.click(function(){ 
       alert(root.Home.prop); 
      }); 
     }; 

     return root; 

    })(jQuery, window.MySite || {}); 

// MySite.Contact Extension 
window.MySite = 
    (function ($, root) { 

     root.Contact = {}; 

     // More stuff for contact 

     return root; 

    })(jQuery, window.MySite || {}); 

El primer cambio se está dividiendo cada "espacio de nombres" en su propio patrón de módulo, variables, de modo privado suele sangrar de espacio de nombres de espacio de nombres (si tiene la intención de que sean privados para el espacio de nombres, que sería más C# esque). En segundo lugar, en lugar de acceder al window.MySite, pase el objeto que desea extender (en este caso lo llamo root). Esto te dará cierta flexibilidad.

Sus métodos privados no eran realmente privados. Para hacer un método privado, solo desea hacer una función var que se vincule en el cierre, pero no se asigne a una propiedad en el objeto visible externamente. Por último, es probable que no desee utilizar $.somegarbage. Como se menciona en un comentario, está agregando una propiedad al objeto $, que seguirá estando allí cuando se cierre. Si quisiera algo cercano, simplemente usaría $somegarbage que a algunas personas parece gustarles, pero cualquier nombre de variable funcionará para variables privadas, siempre que la variable esté vinculada en el ámbito de cierres (no en otro lugar)

Está en el camino correcto ...

Answer 2

Voy a seguir adelante y publicar mi comentario como respuesta, aunque no soy 100% responde a sus preguntas sobre los espacios de nombres C# y sus paralelos en JavaScript (no soy C# programador). En realidad, no está creando variables privadas porque las está adjuntando al objeto $ que existirá después de que termine esta función. Si quiere variables privadas, necesita usar un cierre. Aquellos ser algo como esto:

var myObject = function() { 
    var innerVariable = 'some private value'; 

    return { 
    getter: function() { 
     return innerVariable; 
    } 
    } 
}() 

Si se intenta acceder a myObject.innerVariable volverá undefined pero si usted llama myObject.getter() devolverá el valor correctamente. Este concepto es uno que deseará leer en JavaScript y para programar en general. Espero que ayude.

Answer 3

es posible que desee leer en el Module pattern (more) y cierres en javascript para evitar la contaminación del espacio de nombres global.