Question

I found this little example on jquery documentation page. I always tried returning value from ajax function and I was always told that there is some problem of sync and async thing and I can’t return value out of $.ajax function without making it async.

$.ajax({
  url: "test.html",
  context: document.body
}).done(function() { 
  $(this).addClass("done");
});

In the example above, on what this done function is applied(whats being used as $(this) in example).

one more thing, as the ajax function can’t set global variables, can’t the be set in this done too? cant I return value out of done function either?

Answer 1

what this done function is applied

$.ajax returns a jqXHR object (see first section after the configuration parameter description) wich implements the promise interface and allows you to add callbacks and get notified of changes of the Ajax call.

whats being used as $(this) in example

Inside the callbacks for $.ajax, this refers to the object context refers to in the configuration or the jqXHR instance if context was not set. In this case it refers to document.body:

context: This object will be made the context of all Ajax-related callbacks. By default, the context is an object that represents the ajax settings used in the call ($.ajaxSettings merged with the settings passed to $.ajax).

This and more is all explained in the documentation: http://api.jquery.com/jQuery.ajax/

---

as the ajax function can’t set global variables

That is not correct, any function can set global variables. The problem with asynchronous functions is that you are likely accessing the variable before it was set.

can’t the be set in this done too

See above

cant I return value out of done function either

You can return a value (as in putting a return statement inside the callback), but you cannot return it to your code, since jQuery is calling the callback internally and just ignoring the return value.