Javascript async functionality

Question

I have seen a lot of function examples for async javascript containing setTimeout, AJAX calls, etc.

Obviously these all have a certain delay meaning the flow of the script is impacted. But I was wondering, what if I have something like this:

function init() {
 this.initSlider();
 this.testLog();
}
function initSlider() {
 // find multiple items and build up a slider instance 
 // for each of these elements.
}
function testLog() {
 console.log('test);
}

If initSlider possible takes a long time will it simply run my testLog function first?

I am currently a bit unsure about this. I know there might be plenty of examples on the flow of javascript but I can't find ones where a simple function would just take a longer time to run.

• N.J.Dawson: This doesn't look async, it looks sync to me.
• Thor Jacobsen: This book explains in great detail how async works and should be handled: github.com/getify/You-Dont-Know-JS/tree/master/…. But, your snippet does not expose anything async. We'd need more details.
• Alex: what hinders you make a test? :) generally spoken, a function in javascript doesnt take much time anyways, so the second function call will not "wait", but of course can only be run as soon as the first function has "finished", regardless of ajax calls.
• fdomn-m: @user2521387 you mean I've been wrong to use AJAX for JSON / SignalR / WebApi / REST services all this time and it's only for Javascript to PHP???
• fdomn-m: @Stephan-v it doesn't "skip over" any functions. setTimeout says 'run this code later' and ajax calls say 'make this call to the server and run the 'complete' (etc) code when it completes.

Answer 1

It is totally depend on what is there inside initSlider(). Although initslider() is heavy function and do not contain any asynchronus statement then testLog() will not execute first.

Javascript stores all statements in callstack and they will be executed one after the other.

If there is asynchronus statement then it removes that statement outof the callstack and there is chance of your testLog() to execute.

so for your question my answer will be DEPENDS ON CODE INSIDE initSlider()

• Stephan-v: So what exactly implies an asynchronous statement? I think AJAX and setTimeout are examples of this but is there a list or something? Or am I thinking wrongly here?
• Akash Bhandwalkar: Your question is valid. asynchronus means calls that are not running locally in your client side. suppose you want to call an ajax call to facebook login. so you do not have it. you have ask it to facebook and you are not sure when fb will give it to you so js made it asynchronus so that in the time of processing you can do your other stuff. Anything not running in your client side is asynchronus. setTimeout is made forcefully asynchronus to acheive some goals

Answer 2

Javascript is a technology that runs single threaded. When you use asynchronous methods like AJAX or setTimeout the javascript engine processes those parts one by one (if one is waiting something than switching to another and then back and etc...). You can see the javascript's power on async tasks with Node.js. I guess this blog is very good to understand the Javascript and async methods: click_me!