Comparison of XMLHttpRequest, the Fetch API, and Axios

In the previous sections, we have learned how to fetch data from a server in several ways, XMLHttpRequest, the Fetch API, and Axios. In this section, we are going to compare the differences between the three main methods based on the following factors:

• Ease of syntax
• Supporting promises
• Browser support

We will discuss which method we want to use:

• Ease of syntax: When we compare the syntax in the previous section, the Fetch API and Axios provide much easier syntax than XMLHttpRequest. The syntax of Fetch and Axios is cleaner and simpler to understand and also ensures fewer lines of boilerplate code.
• Supporting promises: The Fetch API and Axios provide promises. We are going to talk about promises in more depth in Chapter 15, Promise API and async/await, but briefly, they allow you to chain functions, which helps us avoid callback hell.

  Callback hell is an anti-pattern that consists of...