Javascript : How do I achieve this execution order?

I have something like this.

function a() {
  ajax(callback_function);
}

callback_function() {
  // done!, called after ajax is finished
}

function b() {
  a();
  c();  // make sure c is executed AFTER a is finished.
}

function c() {
  // called after a开发者_开发百科()!
}

How do I make sure that the function c() is called AFTER a() is finished? I think I have to use another callback function, but unsure of what to do.

EDIT

Didn't make it clear. I'd prefer if I didn't call c() inside my callback_function since a() can be called without needing to call c().

you can wrap all your callbacks into an anonymous function :

function a(callback) {
    ajax(function(){
        callback_function();
        callback();
    });
}

callback_function() {
  // done!, called after ajax is finished
}

function b() {
  a(c);
   // make sure c is executed AFTER a is finished.
}

function c() {
  // called after a()!
}

or you could register another callback to your callback_function :

function a(callback) {
  ajax(function(){
    callback_function(callback);
});
}

callback_function(callback) {
  // done!, called after ajax is finished
  callback();
}

function b() {
  a(c);
   // make sure c is executed AFTER a is finished.
}

function c() {
  // called after a()!
}

A more elegant (and better) way is to bind callbacks to a certain custom event such as "ajax-done" and after the ajax code successfully executes, you can trigger that specific event.
If you use jquery, the event-method is quite simple :

function a() {
  ajax(function(){
    $(window).trigger('ajax-done');
  });
}

callback_function() {
  // done!, called after ajax is finished
}

function b() {
  a();
   // make sure c is executed AFTER a is finished.
}

function c() {
  // called after a()!
}
$(window).bind('ajax-done',callback_function);
$(window).bind('ajax-done',c);

Of course you can do the same thing without jquery, but it's a bit messier since you have to make sure that your code is cross-browser.

You could call c() from your callback function

You can rework a so it takes a callback function as a parameter. That way, you can call it for the scenario where c needs to be called after and where it doesn't need to be called:

function a(callback) {
    ajax(callback);
}

function callback_function() { }

function b() {
    a(function() {
        callback_function();
        c();
    });
}

function b2() {
    a(callback_function);
}

function c() { }

If you don't want to tie your callback with calling c() directly you have 2 options:

1.Either change a to this:

function a(fn) {
    ajax(function() {
        callback_function();
        if (fn) fn();
    });
}

And now you have:

function b() {
    a(c);
}

2.Add a signal at the end of callback_function:

function callback_function() {
    // ...
    emit('callback_done', { param1: true, param2, false });
}

function b() {
    connect('callback_done', c);
    a();
}

No need to create another callback, simply call the c function in the end of callback function

function a() {
  ajax(callback_function);
}

callback_function() {
  // Do whatever you need with data from ajax
  c();
}

function b() {
  a();
}

function c() {
  // called after a()!
}

If I've understood what you're trying to do properly, you could use an anonymous function for this particular case, which means you won't have to modify or duplicate your callback function:

function a() {
    ajax(function() {
        callback_function();
        c();
    });
}
function callback_function() {}
function c() {}