How JS determine when to call Callback function?

Question

I am wondering how JavaScript callbacks work. I specifically can't understand how asynchronous XmlHttpRequest works. How can JS determine that server returned some value (in one thread), and when to call callback method? Is it build on timers?

Close to a dup of this: http://stackoverflow.com/questions/7575589/how-does-javascript-handle-ajax-responses-in-the-background/7575649#7575649 — jfriend00, Jan 12 '12 at 17:28

score 2 · Accepted Answer · edited May 23 '17 at 11:48

2

A very similar question was answered here in more detail.

The basic answer is that the underlying networking is happening at the OS level where there can be threads or some type of notifications when incoming networking packets arrive. When the result has completed, an event is added to the javascript event queue. When that event gets to the top of the event queue and javascript is ready to act on it, the proper javascript ajax event will be triggered which starts the chain of javascript that results in calling your callback.

There may some timers involved for timeouts, but timers are not used to know when the ajax response has arrived. That's based on the OS level networking support that the browser uses.

edited May 23 '17 at 11:48

Community

1
1

answered Jan 12 '12 at 17:28

jfriend00

683,504
96
985
979

thanks for comlitely answer, but where this events are registered on the OS level(before OS notificate JS event queue)? They are registered in thread, which runs after new page of browser opened? – WelcomeTo Jan 12 '12 at 17:57
@Hello - sorry, but I don't understand your question. The javascript engine is implemented in native OS-level code. It is free to use the full range of OS-level capabilities for networking in its implementation. It can use blocking threads, socket notifications, etc... – jfriend00 Jan 12 '12 at 18:00
You answered in other question: "when the ajax response is done, some native code will know it's done and put an event into the JS queue." But where native code keep information about this registered events? – WelcomeTo Jan 12 '12 at 18:06
1

I think you're asking a question about how the internals of a given javascript event queue implementation works. That will vary from one implementation to the next. – jfriend00 Jan 12 '12 at 18:08

score 1 · Answer 2 · answered Jan 12 '12 at 17:11

You wouldn't use timers since you couldn't tell when they should trigger.

I'd imagine it is using some sort of stack/queue [list or table] to keep track of calls and popping the response function off depending on the returned info telling you which request it was responding to.

score 1 · Answer 3 · answered Jan 12 '12 at 17:13

1

Remember, javascript runs in an environment. That environment is not single threaded. When an xhr returns the browser (the environment) notifies the javascript engine that the xhr returned, and it in turn will execute the callback. Also remember that even though the programming model of javascript for the user is single threaded, javascript itself does not have to be.

answered Jan 12 '12 at 17:13

hvgotcodes

118,147
33
203
236

thanks. But how to understand this: "even though the programming model of javascript for the user is single threaded, javascript itself does not have to be." How can JS itself be multithreaed? If it by nature is singlethreaded – WelcomeTo Jan 12 '12 at 17:17
there are 2 parts to javascript. the part you use, which does not expose threading. Then there is the javascript interpreter, which is what runs your code. that part can be threaded. – hvgotcodes Jan 12 '12 at 17:19

score 1 · Answer 4 · answered Jan 12 '12 at 17:14

Basically..

Whenever there's no javascript executing at the moment, events triggering from settimeout and responses to XmlHttpRequest are checked. They are indeed added to an event queue.

The interesting effect of this, is that as long as javascript is currently executing, events like these will never be triggered.

score 1 · Answer 5 · answered Jan 12 '12 at 17:14

1

The asynchronous nature of the XmlHttpRequest is provided at lower level than javascript (by the browser). The callback function is initiated by the browser signalling to the javascript engine that the request is complete.

answered Jan 12 '12 at 17:14

Rich O'Kelly

41,274
9
83
114

hm...in other words this events (xhr callbacks, timer callbacks, mouse listeners etc) are included into browsers queue and browser signals to JS engine that some event is happens? – WelcomeTo Jan 12 '12 at 17:34

How JS determine when to call Callback function?

5 Answers5