Refactoring and condensing a Javascript function with many repeat conditions, strings, and variables I have this function which is pretty easy to read and works just fine. I'm looking to advance my coding abilities by writing more concise code, though.

Does anyone know of an elegant way to condense this down? Any pointers very much appreciated! Thank you!            

var $_GET = {};

document.location.search.replace(/\??(?:([^=]+)=([^&amp;]*)&amp;?)/g, function () {
    function decode(s) {
        return decodeURIComponent(s.split("+").join(" "));
    }

    $_GET[decode(arguments[1])] = decode(arguments[2]);
});

function create_filter_input($name, $termname) {
    var $input = '&lt;input class="query-input" type="hidden" value="' + $termname + '" name="' + $name + '" /&gt;';
    return $input;
}

area = $_GET["area"],
type = $_GET["property_type"],
style = $_GET["style"],
feature = $_GET["feature"],

if(area || type || style || feature) {                                      
    if(area) { 
        areainput = create_filter_input('area',area); 
        $filterTerms.append(areainput);
    }

    if(type) { 
        typeinput = create_filter_input('property_type',type);  
        $filterTerms.append(typeinput);
    }

    if(style) {
        styleinput = create_filter_input('style',style);
        $filterTerms.append(styleinput);
    }

    if(feature) { 
        featureinput = create_filter_input('feature',feature); 
        $filterTerms.append(featureinput);
    }
}




This is my current solution based on your answers! I think it's pretty concise. Let me know what you think! thanks again.

function create_filter_input($name, $termname, $filterterms) {
    if($termname) {
        var $input = '&lt;input class="query-input" type="hidden" value="' + $termname + '" name="' + $name + '" /&gt;';
        $filterterms.append($input);
    }
}

create_filter_input('area',area,$filterTerms);
create_filter_input('property_type',type,$filterTerms);
create_filter_input('style',style,$filterTerms);
create_filter_input('feature',feature,$filterTerms);
Try to avoid repetition.        

var args, i, check, len, filtered;

function parseUrl() {
    var getArgs = {};

    function decode(s) { // declare this function only once, don't declare functions inside any kind of loop
        return decodeURIComponent(s.replace(/\+/g, ' '));

    document.location.search.replace(/\??(?:([^=]+)=([^&amp;]*)&amp;?)/g, function () {
        getArgs[decode(arguments[1])] = decode(arguments[2]);
    });

    return getArgs;
}

function create_filter_input($name, $termname) {
    var $input = '&lt;input class="query-input" type="hidden" value="' + $termname + '" name="' + $name + '" /&gt;';
    return $input;
}

args = parseUrl();
check = ['area', 'property_type', 'style', 'feature'];
len=check.length;

for(var i=0; i&lt;len; i++) {
    if (!args[check[i]]) {
        continue;
    }
    filtered = create_filter_input(check[i], args[check[i]]); 
    $filterTerms.append(filtered);
}


Try to write code anticipating change and write it to make your life easy. For example this:

type = $_GET["property_type"],


creates a variable named type but you then effectively need a map to get back to "property_type":

create_filter_input('property_type',type);


Is the same as:

create_filter_input('property_type', $_GET["property_type"]);


(Which, incidentally is the same as: create_filter_input('property_type', $_GET.property_type); - use dot notation where possible.)

If you write it like that - seeing that you are passing (almost) the same argument in all use cases to your create_filter_input function - you can start to see/think that you don't need 2 local variables - just having "property_type" is enough.

As one of the other answers says - don't serially append to the dom. each write is relatively expensive. it's better to build a dom fragment and append it to the dom in one go.