During interviews, I often ask candidates how to “manually” implement an Ajax call in classic JavaScript. I’m not asking for the exact perfect syntax off of the top of their heads, however, I do want to hear about the basic core/native classes, objects, properties, and methods that enable asynchronous request/response handling.
Many developers only know the jQuery shorthand syntax (i.e. $.ajax and friends), and many know neither implementation (native nor jQuery) at all. For the former, I usually take jQuery away as an option and then commonly discover that fundamental knowledge of native JavaScript is poor, and really to the point of the question, that a solid understanding of asynchronous message processing is lacking.
Hopefully this post gives the reader some insight on objects and concepts that s/he should know well if s/he wants a deeper understanding of asynchronous request processing in HTTP through JavaScript.
So, what native classes, objects, and properties I’m referring to:
- XMLHttpRequest
- Msxml2.XMLHTTP
- Microsoft.XMLHTTP
- onreadystatechange property of these objects
- open and send methods of these objects
- readyState and status properties of these objects
- responseText and responseXML properties of these objects
And, what should one generally know at a minimum
- How to get the correct XMLHTTP request object based on the browser’s JavaScript and ActiveX support
- How to assign an event handler to the onreadystatechange property
- How to open and send requests along with POST versus GET
- setRequestHeader, common Content-Types, and what each content type generally means
- How to send parameters in the request
- How to process requests’ results in the onreadystatechange handler
- What the various readyState values are and what they mean
- What some common success and failure values are for the status property
- What responseText and responseXML are all about
Of course, there are many web based and bound tutorials on this topic; read through them and determine which is most effective and follows safest/best practices. Me, personally, I learned my basic implementation from a book titled, “Bulletproof Ajax” by Jeremy Keith many years ago and have continued to build on those concepts ever since.