这是我jQuery脚本的一个好结构吗?

7
我希望在一个.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中的惯用布局吗?

6
你创建私有变量的方式是错误的。你把它们附加到 $ 对象上,这会在代码执行完后仍然存在。你需要使用闭包来实现。 - g.d.d.c
1
@g.d.d.c 这将是一个很好的答案。 - vhallac
3个回答

3

虽然我不是100%确定它是否回答了你关于c#命名空间及其在JavaScript中的对应问题(我不是c#程序员),但我会把我的评论作为答案发布。你并没有真正创建私有变量,因为你将它们附加到$对象上,在这个函数完成后,它将存在。如果你想要私有变量,你需要使用闭包。它们看起来像这样:

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

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

如果您尝试访问myObject.innerVariable,它将返回undefined,但如果调用myObject.getter(),它将正确返回值。这个概念是JavaScript和一般编程中需要了解的。希望这能帮到你。

是的,你说得对,我没有注意到。那它们就是公共变量了。谢谢。 - jsn00bs

1

这是我会实现你想要做的模式的方式:

// 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)。这将为您提供一些灵活性。
您的私有方法并不真正是私有的。要创建私有方法,只需创建一个函数变量,该变量绑定在闭包中,但未分配给外部可见对象的属性。最后,您可能不想使用$.somegarbage。如评论中所述,您正在向$对象添加属性,当闭包完成时,该属性仍将存在。如果您想要类似的东西,我只会使用$somegarbage,某些人似乎喜欢这样做,但是任何变量名称都可以用于私有变量,只要变量在闭包范围内绑定(而不是其他地方)。
您正在正确的轨道上...

0

你可能想要了解一下模块模式更多)和javascript中的闭包,以防止污染全局命名空间。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接