Optimizing JSLink Script

Question

I'm using JSLink to color code similar columns in a list view. I need set it up to color code 20+ columns, and the script I'm currently using seems a bit redundant. Is there a more optimized/less redundant way to write this for the additional 20+ columns? This is the script currently used to handle the first two fields:

(function () {
    var condFieldCtx = {};
    condFieldCtx.Templates = {};
    condFieldCtx.Templates.Fields = {
        "field1": {"View": colorCode1},
        "field2": {"View": colorCode2}
    };
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(condFieldCtx);
})();

function colorCode1(ctx) {
    var ctxValue = ctx.CurrentItem.field1;

    if (ctxValue == 'TBD' || ctxValue.indexOf("N") !== -1 ) {
        return "<span style='background-color:#FFC107;'>" + ctxValue + "</span>";
    } else if (ctxValue == 'No') {
        return "<span style='background-color:#F44336;'>" + ctxValue + "</span>";
    } else if (ctxValue == 'Yes' || ctxValue.indexOf("Available") !== -1 ) {
        return "<span style='background-color:#4CAF50;'>" + ctxValue + "</span>";
    } else { return ctxValue; }
}

function colorCode2(ctx) {
    var ctxValue = ctx.CurrentItem.field2;

    if (ctxValue == 'TBD' || ctxValue.indexOf("N") !== -1 ) {
        return "<span style='background-color:#FFC107;'>" + ctxValue + "</span>";
    } else if (ctxValue == 'Deny') {
        return "<span style='background-color:#F44336;'>" + ctxValue + "</span>";
    } else if (ctxValue == 'Yes' || ctxValue.indexOf("Available") !== -1 ) {
        return "<span style='background-color:#4CAF50;'>" + ctxValue + "</span>";
    } else { return ctxValue; }
}

Thank you!

Answer 1

You could use ctx.CurrentItem[ctx.CurrentFieldSchema.Name] instead. See the code below:

function colorCode(ctx) {
 var ctxValue = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
 if (ctxValue == 'TBD' || ctxValue.indexOf("N") !== -1) {
    return "<span style='background-color:#FFC107;'>" + ctxValue + "</span>";
 } else if (ctxValue == 'No' || ctxValue == 'Deny') {
    return "<span style='background-color:#F44336;'>" + ctxValue + "</span>";
 } else if (ctxValue == 'Yes' || ctxValue.indexOf("Available") !== -1) {
    return "<span style='background-color:#4CAF50;'>" + ctxValue + "</span>";
 } else { return ctxValue; }
}