jquery – understanding a modular javascript pattern

I\’m trying to write \’better\’ javascript.

Below is one pattern I\’ve found, and am trying to adopt. However, I\’m slightly confused about its use.

Say, for example, I\’ve got a page called \”Jobs\”. Any JS functionality on that page would be encapsulated in something like:

window.jobs = (function(jobs, $, undefined){
    return {
        addNew: function(){
            // job-adding code
        }
    }
})(window.jobs|| {}, jQuery);

$(function(){
    $(\'.add_job\').on(\'click\', function(event){
        event.preventDefault();
        window.jobs.addNew();
    });
});

As you can probably deduct, all I\’ve done is replaced all the code that would have sat inside the anonymous event-handler function, with a call to a function in my global jobs object. I\’m not sure why that\’s a good thing, other than it\’s reduced the possibility of variable collisions and made the whole thing a bit neater, but that\’s good enough for me.

The – probably fairly obvious – question is: all my event-binding init-type stuff is still sitting outside my shiny new jobs object: where should it be? Inside the jobs object? Inside the return object inside the jobs object? Inside an init() function?

I\’m just trying to get a sense of a stable, basic framework for putting simple functionality in. I\’m not building JS apps, I\’d just like to write code that\’s a little more robust and maintainable than it is currently. Any and all suggestions are warmly welcomed

Rating: 1 out of 5 based on 3 ratings

Posts Related to jquery - understanding a modular javascript pattern

• Jul 14th, 2012 Javascript regex to validate GPS coordinates Saturday PM 13:12:01


• Jul 22nd, 2012 Specify function to be called in jquery Sunday AM 08:46:47


• Jul 09th, 2012 JSON results into a variable and store in hidden input field Monday PM 15:34:13


• Jul 22nd, 2012 javascript - Can jquery do what javacript can do Sunday PM 13:57:20


• Jul 08th, 2012 javascript - Adding JQuery code to a Rails 3.2 app? Sunday PM 18:32:14


• Jul 17th, 2012 javascript - jQuery vs document.querySelectorAll Tuesday AM 05:00:30


• Jul 17th, 2012 php - When I add two scripts to a html page..one is doesnt work Tuesday AM 03:10:02


• Jul 12th, 2012 internet explorer 9 - Jquery .on() not working Thursday AM 06:32:02


• Jul 09th, 2012 html5 required and jquery submit() Monday AM 07:44:28


• Jul 14th, 2012 jquery - Javascript?:How to dynamically add text inputs/form fields to a HTML form? Saturday AM 06:41:50

The post jquery – understanding a modular javascript pattern appeared first on Javascript ASK.

via Javascript ASK http://javascriptask.phpfogapp.com/jquery-understanding-a-modular-javascript-pattern.html