Javascript combine 2 functions into one

Question

I have similar problem with this: Combine 3 functions into one in javascript

I have functions:

test: function() {
    for (var i = 0; i < settings.columns.test.length; i++) {
        $table.find('tbody td.test').each(function() {
             $.each(jQuery.parseJSON(settings.columns.test[i][1]), function(index, value) {
                 if ($(this).text() === value) {
                     input += '<option value="' + index + '" selected>' + value + '</option>';
                 } else {
                     input += '<option value="' + index + '">' + value + '</option>';
                 }
                 //more code...
            });
        });
    }
},
test2: function() {
    for (var i = 0; i < settings.columns.test2.length; i++) {
        $table.find('tbody td.test2').each(function() {
             $.each(jQuery.parseJSON(settings.columns.test2[i][1]), function(index, value) {
                 if ($(this).text() === value) {
                     input += '<option value="' + index + '" selected>' + value + '</option>';
                 } else {
                     input += '<option value="' + index + '">' + value + '</option>';
                 }
                 //more code...
            });
        });
    }
},

I'm calling these functions by:

columns: {
    test1: [["key", '{"0": "First value", "1": "Second Value"}']],
    test2: [["key", '{"0": "One more value", "1": "One more more value"}']]
}

As you see, these two functions are same, only test -> test2.. Is it possible to make one function and call it with another values for selector? Thanks in advance

For simple stuff, using params is fine. But if for any reason you wanted to have 2 functions test1 & test2, you can use a functional closure to create them. Not sure what the correct term is, but a functional builder would sound about right.. — Keith, Aug 24 '17 at 20:32
Extract changeable things as arguments of the function like `function(selector, column)` — Yu Jiaao, Aug 25 '17 at 00:08

score 3 · Accepted Answer · edited Aug 24 '17 at 20:24

3

Use a param in your test function, then replace all instances of test with that param (when accessing as a property, eg columns.test, use bracket notation to evaluate the param instead)

test: function(selectorValues) {
    for (var i = 0; i < settings.columns[selectorValues].length; i++) {
        $table.find('tbody td' + selectorValues).each(function() {
             $.each(jQuery.parseJSON(settings.columns[selectorValues][i][1]), function(index, value) {
                 if ($(this).text() === value) {
                     input += '<option value="' + index + '" selected>' + value + '</option>';
                 } else {
                     input += '<option value="' + index + '">' + value + '</option>';
                 }
                 //more code...
            });
        });
    }
},

//invoke using the objects you created (or pass values directly)
test(columns.test1)

edited Aug 24 '17 at 20:24

answered Aug 24 '17 at 20:20

Nick

78
6

Do note that jQuery enables [multiple selectors](https://api.jquery.com/multiple-selector/) when querying for elements. So `$table.find('tbody td.test, tbody td.test2')` should be a valid selector, possibly easily solving the OP's problem. – Jakub Jankowski Aug 24 '17 at 20:25
Ok thank you so much, but how can I use this function now? My code: `$("#profileTable").Tabledit({ columns: { identifier: [0, "id"], row: [["row"]], test1: [["value.."]], test2: [['value....']] } });` – EvaldasL Aug 24 '17 at 20:26
I'm using http://markcell.github.io/jquery-tabledit/ , there I need firstly to write `Draw.columns.test1(); Draw.columns.test2();` – EvaldasL Aug 24 '17 at 20:29
Looks like I've understand how to use.. Thanks – EvaldasL Aug 24 '17 at 20:34

Javascript combine 2 functions into one

1 Answers1