Question

Really, I'm looking at the pattern in my code and realizing it could potentially be simplified. So, that's the ultimate goal. This is for a plugin I'm writing that calls different functions based on the existence of certain data attributes.

var a = $.extend({},$.bcplugins.defaults,options);
var b;

// a variable for each plugin's data attribute
var crumbsInstances = doc.find('[data-bcp-crumbs]'),
    copyrightInstances = doc.find('[data-bcp-copyright]'),
    activeNavInstances = doc.find('[data-bcp-activenav]');


// Determine wich functions get called
if (crumbsInstances.length) {
    crumbsInstances.each(function() {
        b = {};
        b = $$.extend({}, b, $(this).data(a.dataOptions));
        crumbs(a,b);
    });
}
if (copyrightInstances.length)  {
    copyrightInstances.each(function()  {
        b = {};
        b = $$.extend({}, b, $(this).data(a.dataOptions));
        copyright(a,b);
    });
}
if (activeNavInstances.length)  {
    activeNavInstances.each(function()  {
        b = {};
        b = $$.extend({}, b, $(this).data(a.dataOptions));
        activeNav(a,b);
    });
}

This plugin will have a growing number of functions over time. Can I reduce this down to one if statement through variables?

Was it helpful?

Solution

Maybe something like this:

function processInstance($obj, callFunc){
  if ($obj.length)  {
    $obj.each(function()  {
        b = {};
        b = $$.extend({}, b, $(this).data(a.dataOptions));
        callFunc(a,b);
    });
  }
}

var crumbsInstances = doc.find('[data-bcp-crumbs]'),
    copyrightInstances = doc.find('[data-bcp-copyright]'),
    activeNavInstances = doc.find('[data-bcp-activenav]');

processInstance(crumbsInstances, crumbs);
processInstance(copyrightInstances, copyright);
processInstance(activeNavInstances, activeNav);

OTHER TIPS

To extend on previous answer and add to your comment about making it a plugin:

(function($) {
    if (!$.goData) {
        $.extend({
            goData: function() {
                function go($this, cb) {
                    var a = $.extend({},$.bcplugins.defaults,options);
                    if ($this.length) {
                        $this.each(function(i) {
                            b = {};
                            b = $.extend({}, b, $(this).data(a.dataOptions));
                            //  use of apply allows for element to be passed to function
                            cb.apply($this, [a, b]);
                        });
                    }
                }

                go($(document).find('[data-bcp-crumbs]'), $.goData.methods.crumbs);
                go($(document).find('[data-bcp-copyright]'), $.goData.methods.copyright);
                go($(document).find('[data-bcp-activenav]'), $.goData.methods.activeNav);
            }
        });
        $.goData.methods = {
            crumbs: function(a,b) { console.log(this, a, b); },
            copyright: function(a,b) { console.log(this, a, b); },
            activeNav: function(a,b) { console.log(this, a, b); }
        }
    }
})(jQuery);

// use
$.goData();

Of course this would require $.bcplugins.defaults is included first or you could simply add this to that plugin.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top