Retrieve and cache web SPI results, then display on page
Closures in JavaScript


  I'd like some general JavaScript feedback but more specifically how to avoid globals. I understand they're evil in every language but do they seem to be unavoidable here?


You can easily avoid globals in JavaScript using closures.
I suggest to read more about the subject,
for example in this article by Douglas Crockford.

In fact you have already used the concept here:


function retrieveFromStore() {
    var data;
    window.store.get('data', function (d) { data = d.value; });
    return data;
}



The anonymous function in the call to store.get uses the data variable defined outside of the function, but within its closure.

As another example, and a simple solution to avoid window.store,
you could define all your functions within the outer $(function () { ... });, and then store will be visible to them, for example:

$(function () {
    var store = new Lawnchair(function () { });

    function storeData(data) {
        store.save({ key: 'data', value: data });
    }

    // ... other functions
});


Append directly instead of accumulating text

This function accumulates text in a variable before appending to the dom:


function drawData() {
    var data = retrieveFromStore();
    var text = '';
    for (var i = 0; i &lt; data.length; i++) {
        text += '&lt;p&gt;' + data[i].Name + '&lt;/p&gt;';
    }
    $('#results').append(text);
}



This is unnecessary,
you could append directly:

function drawData() {
    var data = retrieveFromStore();
    var results = $('#results');
    for (var i = 0; i &lt; data.length; i++) {
        results.append('&lt;p&gt;' + data[i].Name + '&lt;/p&gt;');
    }
}


Note that the reason for var results = $('#results'); is to avoid repeated dom lookups, which can be expensive.
It's a good practice to save repeatedly used dom lookups in variables.