在另一个函数中调用javascript函数时，它是否同步执行？

Question

In the following code:

function doStuffA() {
 // DO SOME THINGS

 doStuffB();

 // DO SOME MORE THINGS
}
function doStuffB() {
// DO B THINGS
}
doStuffA();

What order is the code executed?

Is it:

1. DO SOME THINGS
2. DO B THINGS
3. DO SOME MORE THINGS

Or:

1. DO SOME THINGS
2. DO B THINGS & DO SOME MORE THINGS - AT THE SAME TIME

Answer 1

Assuming you intended for there to be a call to doStuffB in doStuffA , and a call to doStuffA somewhere...

Javascript is traditionally executed synchronously.

Therefore:

1. DO SOME THINGS
2. DO B THINGS
3. DO SOME MORE THINGS

Answer 2

There's been a lot of discussion about your syntax, but I think I can fill in the blanks well enough to understand what you're asking. You want to know whether JavaScript is executed sequentially; specifically, if a function call will pause execution of the calling function until the called function terminates.

General case

For the general case, the answer is yes. Here's some example code to illustrate this:

var count = 0;
var result = "";

function a() {
    result += "first part of A. \n";    
    b();    
    result += "last part of A. ";
}

function b() {
    for (var i = 0; i < 100000; i++) {
        count++;
    }
    result += "even after " + count + " cycles, A waits for B. \n";
}

a();
console.log(result);

Runnable version on jsFiddle: http://jsfiddle.net/jmorgan123/574Rh/

Try it out. You'll see that the result is:

first part of A. 
even after 100000 cycles, A waits for B. 
last part of A.

Exceptions to the rule

There are exceptions to this, and they're very important. When you set an interval or timeout, the program starts a timer and plans to run a function when the timer finishes. But it doesn't wait around for that to happen; once the timer has started, the rest of the program goes on with its other tasks:

//won't do what you want:
result += "first part of A ";  
setInterval(b, 1000);
result += "last part of A ";

In this case, when a() is finished running, result will be:

first part of A, last part of A 

In fact, that's all you'll see, because console.log(result) will run before b() does.

Another important case where JS defers execution is in AJAX calls; this trips people up all the time. Here's an example of this mistake:

//also won't do what you want:
result += "first part of A ";
$.get('ajax/test.html', function(data) {
    result += "now with AJAX! "; 
});
result += "last part of A ";

Again, result will be first part of A, last part of A when console.log(result) runs. The only way to guarantee your code runs after the AJAX call is by putting it in the callback:

var result = "";

function a() {
    result += "first part of A ";
    $.get('ajax/test.html', function(data) {
        result += "now with AJAX! "; 
        result += "last part of A ";
        console.log(result);
    });
}

a();

alert() and confirm()

One final note: Interestingly, the functions alert() and confirm() do , in fact, interrupt control flow. If your code looks like this:

result += "first part of A, ";  
result += confirm("what is your choice?"); //let's assume you click 'OK' here
result += ", last part of A";

...the result will be first part of A, true, last part of A no matter how long you wait to click OK. confirm and alert are the only cases (correct me if I'm wrong) where JavaScript will pause execution while it waits for some outside source.

Answer 3

Okay, assuming you want to call doStuffA() ...

    function doStuffA() {
     // DO SOME THINGS

     doStuffB();

     // DO SOME MORE THINGS
    }
    function doStuffB() {
    // DO B THINGS
    }

The above will result in

1. DO SOME THINGS
2. DO B THINGS
3. DO SOME MORE THINGS

If you want the asynchronous approach you would use setTimeout() . Here are some docs: https://developer.mozilla.org/en-US/docs/DOM/window.setTimeout

ie

    function doStuffA() {
     // DO SOME THINGS

       setTimeout(doStuffB,1);

     // DO SOME MORE THINGS
    }
    function doStuffB() {
    // DO B THINGS
    }