javascriptjqueryfunction

javascript jquery function is this somehow wrong?


function rebuildJSONObject(){
   $.getJSON('services.json', function(data) {
        //stof start
        var input = data;
        var output = { myservices: [] };
        for (var key in input) {
            if (input.hasOwnProperty(key)) {
                for (var i = 0, hostsinfo = input[key].hostsinfo; i < hostsinfo.length; i++) {
                    output.myservices.push({
                        'nametag': key,
                        'hostidn': hostsinfo[i]['hostidn'],
                        'details': hostsinfo[i]['details'],
                        'currstatus': hostsinfo[i]['currstatus'],
                        'currstatusclass': hostsinfo[i]['currstatusclass']
                    });
                }
            }
        }
        //stof end
        return output;
    });
}
//setting it for use later in the script
var serviceJSONObject = rebuildJSONObject();

I know the stuff going on in the function is working properly cause if I apply it to a click event it works charming. However I would rather load the JSON object into memory once and work with it client side there after unless saved. My Problem is however anywhere I call serviceJSONObject I get an "undefined" error.

So How am I doing this wrong and how would I define a variable like this early in the game so the rest of the script can use said variable.


Solution

  • Why not add a cache property to a function that will store the result of the initial output (loaded via ajax) and returning the saved state to any consecutive call.

    function rebuildJSONObject(callback) {
        var self = this;
    
        if (typeof self.cache !== 'undefined') {
            if (typeof callback === 'function') {
                callback(self.cache);
            }
            return;
        }
    
        $.getJSON('services.json', function(data) {
            //stof start
            var input = data,
                output = { myservices: [] };
    
            for (var key in input) {
                if (input.hasOwnProperty(key)) {
                    for (var i = 0, hostsinfo = input[key].hostsinfo; i < hostsinfo.length; i++) {
                        output.myservices.push({
                            'nametag': key,
                            'hostidn': hostsinfo[i]['hostidn'],
                            'details': hostsinfo[i]['details'],
                            'currstatus': hostsinfo[i]['currstatus'],
                            'currstatusclass': hostsinfo[i]['currstatusclass']
                        });
                    }
                }
            }
            //stof end
            self.cache = output;
    
            if (typeof callback === 'function') {
                callback(self.cache);
            }
    
            return;
        });
    }
    

    EDIT: For the first time you will need to call this function asynchronously and supply a callback function, for example

    rebuildJSONObject(function(output) {
    
        /*
         * Process your output here
         */
    
        console.log(output);
    
    });
    

    Each consecutive time you can again use it synchronously:

    console.log(rebuildJSONObject.cache);