CODEWITHSUNDEEP
javascriptmodulecallback
zok
zok

Reputation: 7902

Module pattern callback implementation

I'm rewriting a simple app using HTML/CSS/JavaScript that creates animations with images using intervals, and there's a bunch of buttons that controls these animations.

It's scaling and becoming really messed up, with logic mixed with DOM manipulations via jQuery all through one javascript script file.

So I decided to use the Module design pattern.

Based on my description of the app, is there a problem with this callback implementation for a module?

Or with the module implementation?

In this example, what is the best approach to declare private variables and give access to them through the public api? Getters and setters? Are they really necessary? I want to write readable code but I don't want to over-architect things.

(function($) {

  $.Module = function(options){
    var module = {
      options: $.extend({
        callbacks: {
          start: false
        }
      }, options),
      start: function(callback){
        //console.log('private start method');
        if(typeof callback === "function") {
            callback();
        }
      }
    }

    // public api
    return {
      start: function(){
        //console.log('public start method');
        module.start(module.options.callbacks.start);
      }
    }
  }

}($));

var myModule = $.Module({
  callbacks: {
    start: function(){
      console.log('start callback!');
    }
  }
})

myModule.start();

Here is a sample.

Just because it seems to work to me, and I've seen other implementations that have some code that look like this:

callback: function(method) {
    if(typeof method === "function") {
        var args = [];

        for(var x = 1; x <= arguments.length; x++) {
            if(arguments[x]) {
                args.push(arguments[x]);
            }
        }

        method.apply(this, args);
    }
},

I'm not sure what this last code is supposed to do. Is it intended to return data to the callback function I registered when instantiating the module? If so, how does it work?

Upvotes: 0

Views: 796

Answers (1)

Bergi
Bergi

Reputation: 665101

Is there a problem with this callback implementation for a module?

Not if this what you want.

Or with the module implementation?

Your instantiation of the options property should probably use a deep extend, the current one is overwriting the complete callbacks object.

I'm not sure what this other code I found is supposed to do. Is it intended to return data to the callback function

Yes. It does support multiple arguments, using the arguments object

… I registered when instantiating the module?

No, it does not have to do with registration. It will call the method that is passed as a parameter to this callback function.

Using this code will release you from the need to do that typeof check every time. You would just write

helper.callback(this.options.callbacks.start, /* optional arguments */)
// instead of
if (typeof this.options.callbacks.start == "function")
    this.options.callbacks.start(/* arguments */)

However, until you think that you need this helper you will not need this helper.

Upvotes: 1

Related Questions