Question

In my company we have a survey framework to help stakeholders create surveys, I’m trying to create a re-usable object which will allow a team member to easily set the width of a particular question for a survey – they can sometimes be a bit squished depending on the length of the answers. I’m trying to use a combination of the module and constructor pattern but not sure if I pulled it off correctly. Is there a better way to write my code?

        var WidthIncreaser = (function(){
            return function (element, words, width) {

                var element = $(element);
                var re = new RegExp(words, 'gi');

                return {
                    init: function() {
                        if (element.text().match(re)) {
                            element.width(width);
                        }
                    }
                };
            };
        })();

        var tr = new WidthIncreaser('td.choicev-question:first', 'Applicable from the', 400);
        tr.init();

The idea is, somebody can create a new instance of WidthIncreaser and pass in an element, a string which matches the question’s text so it’s the right question being targeted and the size to set width of the question to.

Thanks for the advice in advance!

Answer 1

You are double wrapping stuff. Anyways, the common module pattern I see is just a function that returns an object with closure.

No need for the new keyword nor an immediate function. Immediate functions are usually used when only one object is made and assigned directly to one variable. In your case, you wanted to make “instances”.

var WidthIncreaser = function(element, words, width) {

    var element = $(element),
        re = new RegExp(words, 'gi');

    return {
        init: function() {
            if (element.text().match(re)) {
                element.width(width);
            }
        }
    };
};

var tr = WidthIncreaser('td.choicev-question:first', 'Applicable from the', 400);

tr.init();​