javascript - 为什么选项没有被覆盖？

Question

在我的模块模式中，由于某种原因，选项“未定义”。有人知道为什么它们没有正确传递吗？

Framework.MyModule = (function(options) {
    var defaults = {
        someOption : 1,
        stuff      : 2
    };
    if (!options) {
        var options = defaults;
    } else {
        for (var index in defaults) {
            if (typeof options[index] == 'undefined')
                options[index] = defaults[index];
        }
    }
    var module = {};

    // Initialize
    _something();

    // Private Methods
    function _something() {}

    // Public Methods
    module.click = function() {};

    return module;
})();


... docready function ...

var options = {
  someOption : 9,
  stuff      : 10
};

Framework.MyModule(options);

... end doc ready ...

请参阅 fiddle :http://jsfiddle.net/kWHEZ/1/

Answer 1

var options = { /* ... */};
Framework.MyModule = (function(options) {
  /* .. options are undefined ... */
})();

Framework.MyModule = (function(options) {
  /* .. options are defined... */
})(options);

现在，如果您希望能够添加私有(private)/公共(public)变量并仍然传递选项，则需要将构造函数方法与公共(public)对象一起返回 - 因此不会在立即运行的函数中传递选项。因为说实话......这确实没有意义。

<小时/>

你可以这样做:

var Module = {};
Module.Foo = (function($){ // jQuery is accessible as $
    var _private = {
        defaults: {
            url: '/default-url', container: '#dummy'
        },
        foos: []
    };

    return function(o){ // returns constructor
        // other _private variables are accessible here
        var opts = $.extend({}, _private.defaults, o);
        var self = { // public return object
            load: function(){
                $(opts.container).load(opts.url);
            }
        };
        _private.foos.push(self);
        return self;
    };
})(jQuery); // scope global variables


var foo1 = Module.Foo({
    url: '/test.php', 
    container: '#success'
});

var foo2 = Module.Foo({
    url: '/test2.php', 
    container: '#success2'
});

foo1.load();
foo2.load();