AJAX Interview Questions


Question 1:

What does AJAX stands for / What is Ajax?

AJAX stands for Asynchronous JavaScript and XML. It is combination of various technologies like Javascript, XML/JSON, HTML, CSS. AJAX is used to make asynchronous request to server from client(webpage).

Question 2:

What are the technologies combined in AJAX?

As we know AJAX is not a technology or language rather it is combination of various technologies which are-

  1. HTML and CSS for presentation.
  2. JavaScript for processing, and DOM (Document Object Model) to access data inside the page or to access elements of XML file read on the server.
  3. XMLHttpRequest object is used to read or send data on the server asynchronously.
  4. XML/JSON is used to transmit data from server to client.
Question 3:

What are the advantages of using AJAX?

OR,

What are the usage of Ajax?

There are many advantages of using AJAX. Some of them are listed below:

  1. Reduces Server Load:- Assume there are 10 images on your webpage and various components on your webpage which loads huge data. Our requirement is to update particular section of your webpage on any event like click on any button which is independent of other components. If you send synchronous request the whole webpage will get updated and server have to process huge amount of data but if you use AJAX, there will be less load as compared to synchronous request as server will process only a portion of webpage.
  2. User Friendly:- As server responds faster without refreshing whole page, it is more user friendly as compared to synchronous HTTP request.
  3. Non blocking:- If you are using AJAX to update the webpage in such case, user can interact with other components of webpage when an AJAX request is initiated. 
Question 4:

What are the disadvantages of AJAX?

Some of the disadvantage of using AJAX are listed below:

  1. Websites where SEO matters:- You should not use AJAX on websites/blogs to update reading content because most web crawlers do not execute JavaScript code and it has negative impact on SEO. Due to this search engine will not be able to index such pages.
  2. The back and refresh button are rendered useless :- If you are using AJAX to update page, in such case back button should be handled properly to render previous page otherwise back button will work based on history.
  3. Dependent on Javascript:- If Javascript is disabled, in such case AJAX won't work.
  4. Bookmark issue:- Proper coding/implementation can avoid bookmarking issue with AJAX, if you update the url also. But it is harder to manage.
Question 5:

Describe various types of ready states in AJAX.

There are 5 ready states in AJAX which are mentioned below:

State Description
0 The request is not initialized
1 The request has been set up
2 The request has been sent
3 The request is in process
4 The request is complete

Question 6:

When should AJAX be used?

AJAX can be used on many situations. Some of them are described below:

  1. Update Small Portion of Website continuously:- You might have seen websites which provides cricket score. In such situation where only a piece of information should be updated on a webpage after particular interval continuously, AJAX is very helpful.
  2. Sorting/Filtering:- If you have data in table and you want to filter based on some value or sort based on some column, AJAX plays important role to fetch data from server asynchronously and update the table/grid.
  3. Chat Website:- Assume a chat website in which whole webpage is refreshed after each message you send. It would be bit annoying. In such case AJAX is be used.
  4. Blog Comment:- You can use AJAX where you want user to comment and start discussion. Scroll below and you can comment on comment section and it will send AJAX request to publish your comment.
  5. Autocomplete/AutoSuggest:- We all are aware of Google autosuggest. When we type keyword on Google search box, it suggest various options based on what we entered. It is done using AJAX.
    AUTOSUGGEST USING AJAX
Question 7:

What is difference between jQuery.get() and jQuery.ajax() method?

jQuery.ajax() method is used to perform asynchronous HTTP request.

If you don't need the extensive configurability of $.ajax(), and you don't care about handling errors, the Ajax convenience functions provided by jQuery can be useful, for example $.get() method to load data from the server using a HTTP GET request. These methods are just "wrappers" around the core $.ajax() method, and simply pre-set some of the options on the $.ajax() method.

Question 8:

What is the use of jQuery.ajax method?

ajax() method of jQuery is used to perform asynchronous HTTP request.

The syntax of ajax() method is

$.ajax({name:value, name:value, ... })

Example:

$.ajax({
 
    // The URL for the request
    url: "/example",
 
    // The data to send (will be converted to a query string)
    data: {
        id: 123
    },
 
    // Whether this is a POST or GET request
    type: "GET",
 
    // The type of data we expect back
    dataType : "json",
})
Question 9:

How do you check whether an AJAX request has completed in Javascript?

The XMLHttpRequest object has readyState property and onreadystatechange which can be used to check whether the request has been processed.

  var xhttp;
  xhttp=new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 ) { 
      // Do something
    }
  };
  xhttp.open("GET", url, true);
  xhttp.send();

If you want to check the request has been processed successfully with 200OK status use can check status property of XMLHttpRequest object as shown below:

 var xhttp;
  xhttp=new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      //Do something
    }
  };
  xhttp.open("GET", url, true);
  xhttp.send();
Question 10:

Can we use HTTP GET or POST for AJAX calls?

Yes, we can use HTTP GET as well as HTTP POST for AJAX calls. 

If you are using jQuery library then to send AJAX request using GET you can use $.get() method and for POST you can use $.post() method.

Share interview questions

Comments

Comments
comments powered by Disqus

Navigation

Social Media