Geek asks and answers

Fix jQuery application module template

I am developing a jQuery application for a website and by what I read, the sample module seems to be the best setting.

I started to adapt the module / submodule template and, before writing the application, I wonder if the development is right. Here is a basic example:

var module = (function($, window, document, undefined) {
    return {
        loader : (function() {

            var fade = 250; // public property
            var $loader = $('#loader'); // private property

            // return public properties and methods
            return {
                fade : fade,
                show : function() {
                    $loader.fadeIn(module.loader.fade);
                },
                hide : function() {
                    $loader.fadeOut(module.loader.fade);
                }
            }
        })()
    }
})(jQuery, window, document);
module.loader.fade = 500;
module.loader.show();

Again, the “bootloader” will be an additional module. I want to keep all my modules wrapped in the main module.

I am wondering if I am handling the public property correctly, or if there is a better way?

thank

+3
source share
3 answers

IIFE var module 1, show hide module.loader.fade. . IIFE , . , "module" "module2", IIFE. IIFE .

, fade. , .

.

var module = (function($, window, document, undefined) {
return {
    loader : (function() {

        var fade = 250; // public property
        var $loader = $('#loader'); // private property

        // return public properties and methods
        return {
            fade : fade,
            show : function() {
                $loader.fadeIn(this.fade); // use this
            },
            hide : function() {
                $loader.fadeOut(this.fade); // use this
            }
        }
    })()
}
})(jQuery, window, document);
module.loader.fade = 500;
module.loader.show();

.

var module = (function($, window, document, undefined) {
return {
    loader : (function() {

        var fade = 250; // public property
        var $loader = $('#loader'); // private property
        var stub;
        // return public properties and methods
        return stub = {
            fade : fade,
            show : function() {
                $loader.fadeIn(stub.fade); // use return object to reference fade
            },
            hide : function() {
                $loader.fadeOut(stub.fade); // use return object to reference fade
            }
        }
    })()
}
})(jQuery, window, document);
module.loader.fade = 500;
module.loader.show();
+2

:

module.loader.show();

:

loader : function() {
    ...
}
0

More articles:


All Articles