Question

setTimeout(function() {
    console.log("1");
}
console.log("2");

Basically, what I want to output “1” before “2”. How do I synchronize the callback function with the current “caller” thread?

Answer 1

You can’t hold up the thread in JavaScript (other than the alert and confirm built-ins), so the only ways to make your console.log("2") happen after your console.log("1") are:

1. Put it in the timeout function:

   setTimeout(function() {
       console.log("1");
       console.log("2");
   }, delay);
   

   …or in another function that that timeout function calls, although as you already have a function for the setTimeout, it’s unclear (other than code organization) why you’d need a separate one.

2. Put it in a separate function you pass to setTimeout with a longer delay:

   setTimeout(function() {
       console.log("1");
   }, delay);
   setTimeout(function() {
       console.log("2");
   }, longerDelay);
   

   …being careful that longerDelay really is sufficiently longer than delay that you don’t end up with a bit of chaos around scheduling.

Note I said “the thread” above. Unless you’re using web workers, which have a specific syntax, JavaScript on browsers is single-threaded. Two JavaScript functions cannot run simultaneously, and aside from edge case browser bugs around alert and ajax completions and the like (at least some versions of Firefox run your ajax completion callback while you have a function waiting on alert; strange but true, and nothing you can rely on cross-browser or even cross-version), you can’t pause one JavaScript function in its tracks while another JavaScript function runs.