How does the compiler/interpreter know a function is asynchronous?

Question

I am new to JavaScript and I have a question regarding asynchronous functions when I read about it in the book "JavaScript the good parts":

I understand that the following code will be executed synchronously and may cause delay:

request = prepare_the_request();
response = send_request_synchronously(request);
display(response);

However, the following code is said to be executed asynchronously:

request = prepare_the_request();
send_request_asynchronously(request, function(response){
    display(response);
});

How does the compiler(or interpreter? I am not sure how JavaScript is interpreted) know that the second block of code is supposed to be executed asynchronously?

Thank you in advance.

(If the question is not clear please comment and I am sorry for not expressing it clearly.)

Answer 1

Compiler/Interpreter doesn't know that, and actually doesn't care about it. On multiprocess operating systems, two or more threads can run concurrently, and Javascript's XMLHTTPRequest object allows to run the request in a separate thread. This way, Javscript starts the thread, but since it is running in a separate thread, it doesn't wait and continue with next command.

Answer 2

I'll be completely honest... the first time I read that same Callbacks section on page 53 of Javascript, the good parts, I also made the same assumption as you did hahaha, though only later did I find out what the author meant.

Your previous statement isn't actually correct:

However, the following code is said to be executed asynchronously:

Before the Author displays the code with the callback function, he says the following paragraph:

A better approach is to make an asynchronous request, providing a callback function that will be invoked when the server’s response is received. An asynchronous function returns immediately, so the client isn’t blocked:

The important part here is: ...make an asynchronous request, PROVIDING a callback function...

The author was trying to make the point that you could make a function like:

send_request_asynchronously(request, function (response) {
 display(response);
 });

that doesn't execute function (response) {display(response);} at the time the code is run through the interpreter, but rather some time in the future when a call to send_request_asynchronously is made AND later on in the code you could make it asynchronous. The very code itself has nothing asynchronous about it. It's designed to be called asynchronously later.

The "PROVIDING a callback function" is key to infering this is what the author meant. If you notice, there is no trailing () after the callback function. If you did have a trailing () like so:

send_request_asynchronously(request, function (response) {
 display(response);
 }());//<--- right here

then the function would execute right then and there when the interpreter was reading through that portion of the code, hence forcing the system to be Synchronous, where as by not including (), you open the door for it to be Asynchronous in the future by implementing code with Asynchronous features that then call this function.

As a final important point, lets remember that this is what makes a callback function a callback function. It is not being invoked when you include the function in the parameter. So for instance, if I make a function called salutations:

var salutations = function (hello(){alert('hi')})
{
   alert ('salutations!');
}

and if I had no more code after the previous code, you would never see an alert popup. It would only be invoked when called/invoked after it's declaration/iniciation (HENCE the term: "it's being called back" after it was created AKA callback). However, if I included a trailing () after the callback function, it would then cause the function to actually execute during the declaration and initiation of function salutations.