Wait until all files are loaded asynchronously, then run code
1) Nah, the kids still call it JavaScript, but ECMAScript works too. More power to you for knowing both names :)

2) Yes, I'd say you should wait for a less ambiguous state to occur before considering the request done. But there's not really anything better than onreadystatechange (as far as I recall) to check for the request's success. So you still have to code a "ready-state change" handler, just make it check client.status === 200 (and possibly some headers and whatnot) before deciding what to call next.

Other than that, though, your code's good. The hardcoded 2 would need to go for this to be of general use, but the basic idea of decrementing a counter is solid.

You could take a look at the futures and promises pattern. There are several JS-implementations of this you can use.

jQuery has such an implementation (via the Deferred object) built into it's Ajax-system, allowing you to do, say:

var file1 = $.getJSON("file1.json"), // $.getJSON returns a Deferred
    file2 = $.getJSON("file2.json"), 
    all   = $.when(file1, file2);    // and $.when groups several Deferreds

// example usage - you can do the same for the individual files
all.done(function () {
  // something to call when all files have been successfully loaded
});

all.fail(function () {
  // something to call in case one or more files fail
});

all.always(function () {
  // something to always call (like, say, hiding a "loading" indicator)
});


Point is that Deferred lets you attach handlers asynchronously - the requests are sent the moment you call getJSON, but you can attach handlers whenever. And you can add several handlers to the same state, if you want. If the response has already been received, the handler will simply be called immediately.

Now, I know this is all jQuery, and perhaps you don't want to use that. If so, more power to you (again). It is however a neat approach and a simple API - or (in my opinion) one to emulate if you so choose.



Seeing @Kevindra's simple answer (go upvote!), I'm reminded of a different pattern I've used before:

 // a simple factory function
 function makeCounter(limit, callback) {
   return function () {
     if( --limit === 0 ) {
       callback();
     }
   }
 }

 // ....

 // make a "done" function set up to expect 2 invocations
 // before calling its callback
 var done = makeCounter(2, function () {
   // all done!
 });

 getAsync("file1.json", function () {
   // process file and call the done() function
   done();
 )};

 getAsync("file2.json", function () {
   // process file and call the done() function
   done();
 )};