这是一个很好的结构为我的jQuery脚本

Is this a good structure for my jQuery scripts?

本文关键字:结构 我的 脚本 jQuery 很好 一个      更新时间:2023-09-26

我想把我的脚本组织在一个.js文件中为我的所有网站(我现在有一个烂摊子),像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); 

这是一个习惯的布局在jQuery和JScript?

我将继续发表我的评论作为答案,尽管我不是100%它解决了你关于c#名称空间及其在JavaScript中的相似之处的问题(我不是c#程序员)。您实际上并没有创建私有变量,因为您将它们附加到该函数结束后将存在的$对象。如果需要私有变量,则需要使用闭包。它们看起来像这样:

var myObject = function () {
  var innerVariable = 'some private value';
  return {
    getter: function () {
      return innerVariable;
    }
  }
}()

如果您尝试访问myObject.innerVariable,它将返回undefined,但如果您调用myObject.getter(),它将返回正确的值。这个概念是您需要在JavaScript和一般编程中阅读的。

这是我将如何实现你正在尝试做的模式:

// 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 || {} ); 

第一个变化是将每个"命名空间"划分为自己的模块模式,这样私有变量就不会从一个命名空间流向另一个命名空间(如果你想让它们对命名空间是私有的,这会更像c#)。第二种方法不是访问window.MySite,而是传递您想要扩展的对象(在本例中,我称之为root)。这会给你一些灵活性。

你的私有方法并不是真正私有的。要创建一个私有方法,您只需要创建一个函数var,它在闭包中绑定,但不分配给外部可见对象的属性。最后,您可能不想使用$.somegarbage。就像在评论中提到的那样,您正在向$对象添加一个属性,当闭包完成时,该属性仍然存在。如果你想要一些接近的东西,我只会使用$somegarbage,有些人似乎喜欢这样做,但任何变量名都可以为私有变量工作,只要变量被绑定在闭包范围内(而不是其他地方)

你可能需要阅读javascript中的Module模式(更多)和闭包,以防止污染全局命名空间。