0

信息

我正在尝试构建一个站点,我可以在其中包含某些文件并使用不同的方法附加到我的全局变量中,这些方法可以很容易地添加到对象中。这意味着我只需要包含该文件,此页面现在可以访问 hutber 对象中的所有内容。

核心hutber.js

var hutber = {};

(function ($) {
    "use strict"; //For good development standards :)

    hutber.init = function(){

    };
    hutber.init();
})(jQuery);

额外的位 hutber.form.js

(function ($) {
    "use strict"; //For good development standards :)

    hutber.form = {

    }

});

问题

我知道在闭包hutber中将无法访问它。hutber.form因此,如果不将这些从自我执行功能中取出,我该如何hutber访问hutber.form?或者这只是解决这个问题的完全错误的方法?

4

5 回答 5

4

不,它可以访问,hutber.form因为hutber它是全球性的,但问题在于时间。

如果 init() 在hutber.form函数执行之前运行,它将不存在。init 不能运行到所有的“附加组件”都加载完毕。

附注:您的第二个不会运行,因为它没有(jQuery);.

(function ($) {
    "use strict"; //For good development standards :)

    hutber.form = {

    }

});  <-- missing  (jQuery); so it is not going to do anything

运行一个小演示看看会发生什么。

var myObj = {};

(function(){

    myObj.init = function(){
        alert("init");
        try{ //will fail since bar has not loaded yet
        myObj.bar();
        } catch(e){ alert("failed calling bar"); }
    };
    //call init before bar is loaded
    myObj.init();
})();


(function(){

    myObj.bar = function(){
        alert("bar");
    };
})();

//call init after bar has been loaded
myObj.init();

上面代码的jsFiddle

当你运行它时,你会看到 init 在第一次调用时会失败,因为 bar 没有加载。自添加该方法以来,它将第二次起作用。因此,如果 init 依赖于加载的“模块”,它需要知道它们何时加载才能调用 init 方法。

于 2013-01-18T22:17:01.000 回答
1

我想你想要这个:

<script src="hutber.js"></script>
<script src="hutber.form.js"></script>
<script> hutber.init(); </script>
于 2013-01-18T22:20:09.107 回答
0

看到您如何将 hutber 定义为全局变量,“form”属性肯定可以在任何立即调用的函数表达式中访问。

于 2013-01-18T22:18:39.533 回答
0

您可能以错误的方式看待这个问题。

并不是说立即调用的函数是构建功能的错误方式......

然而,我要说的是,你有一个全局可用的对象,你直接从你的函数中引用它......

分配后hutber.form = {};,全球范围内的所有事物都可以完全访问hutber.form,因为hutber是全局可访问的。

如果你像这样,真的不会有什么不同:

//form.js
hutber = hutber || {};
hutber.form = { /* ... */ };

在公共访问方面hutber.form

闭包涵盖了您不返回的内容以及您不分配给外部范围内的对象/数组/变量的内容。

所以如果你var mySecretIdentity = "Jerry O'Connell";在闭包里面,那么只有里面的方法hutber.form可以访问mySecretItentity......

...但是同样,您可以通过执行以下操作来完成相同的操作:

// form.js
hutber = hutber || {};
hutber.form = (function () {
    var mySecretIdentity = "Jerry O'Connell";

    return {
        submit : function () {},
        clear  : function () {},
        validate : function () {}
    };
}());

现在任何私有的东西都只能被写在闭包内的函数直接访问。

再一次,它归结为:“你想解决什么问题?”

于 2013-01-18T22:30:12.493 回答
0

<script>正如@Sime Vidas 提到的,标签顺序很重要。

执行以下命令:

<script src="hutber.js"></script>
<script src="hutber.form.js"></script>

我修改了jsFiddle中的脚本。你会注意到我喜欢通过使用 window.variable 来明确全局变量。如果这是您想要的,我在核心 hutber.js 文件中的 init 函数会立即触发。

//core hutber.js 
window.hutber = {}; // Explicit Global Variable

(function ($) {
    "use strict"; //For good development standards :)

    window.hutber.init = function(){
      alert('init fired');  
    };

    window.hutber.init(); // You can fire this anywhere since you set it on a global variable...
})(jQuery);

//Extra bits hutber.form.js
(function ($) {
    "use strict"; //For good development standards :)
    window.hutber.form = {prop: "hello im a form"}
    alert('window.hutber.form is now' + window.hutber.form.prop);
})(jQuery);
于 2013-01-18T22:42:52.923 回答