Difference ajax, axios and fetch the

ajax

$.ajax({
   type: 'POST',
   url: url,
   data: data,
   dataType: dataType,
   success: function () {},
   error: function () {}
});

It relies on existing CSS / HTML / Javascript, the core of which is dependent on the XMLHttpRequest object provided by the browser. This object is transmitted to the server requests and resolving server response provides a smooth interface, such that the pages can use this object to issue an HTTP request and receiving an HTTP response so that it can dynamically obtain data, achieved in case the page is not refreshed and server data exchange.

ajxs advantages:

1. reduce the redundancy of the service request and response burden caused.
2. No refresh update page, a better user experience.
3. To reduce the burden on the server sketches, saving space and cost of broadband leased.
4. asynchronous submitted, read and write faster.

ajax disadvantages:

1. AJAX lot of use of javascript and ajax engine, which depend on browser support. Consider the compatibility of the browser at the time of writing.
2. AJAX is just partial refresh, so. Back button page is of no use
3. support for streaming media as well as mobile devices is not very good and so on.

axios

axios({
    method: 'post',
    url: '/user/12345',
    data: {
        firstName: 'Fred',
        lastName: 'Flintstone'
    }
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

After Vue2.0, especially the rain the river is recommended that you replace JQuery ajax with axios, presumably so that axios into many people's eyes.
axios HTTP client is a browser-based Promise for nodejs and, in essence, is the packaging of the native XHR, but it is implemented version of Promise, in line with the latest ES specification, which itself has the following characteristics:

1. Create XMLHttpRequest from the browser
2. Support Promise API
3. Client support to prevent CSRF
4. Provides interfaces concurrent requests (an important, convenient for a lot of operations)
5. Create a http request from node.js
6. Intercept request and response
7. Conversion request and response data
8. Cancellation request
9. Automatically convert JSON data

fetch

try {
  let response = await fetch(url);
  let data = response.json();
  console.log(data);
} catch(e) {
  console.log("Oops, error", e);
}

fetch known as AJAX alternatives are appearing in ES6, ES6 use the promise of an object. Fetch is based on the promise of design. Fetch code much simpler structure than ajax, parameters a bit like jQuery ajax. However, we must remember not fetch the package further ajax, but native js, do not use the XMLHttpRequest object.

fetch advantages:

1. Simple syntax, semantics more
2. Promises to achieve standards-based, support async / await