为什么javascript开发人员应优先选择axios而不是fetch，（技术点评）不明白的小伙伴可以看看哦

概述和语法

Fetch

Fetch()是Fetch API中JavaScript window对象的一部分。它是内置的，因此用户不必安装它。Fetch()允许我们从API异步获取数据，而无需安装任何其他库。

fetch(url)
  .then((res) => {
    // handle response
  })
  .catch((error) => {
    // handle error
  });

上面的代码是一个简单的fetch()的get请求。在fetch()方法中，有一个强制性参数，即url。url是用户希望从中获取数据的路径。然后，通过fetch()方法返回一个可以释放响应对象或因错误而拒绝它的promise。

fetch(url, {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
  },
  body: JSON.stringify(data),
})
  .then((response) => response.json())
  .catch((error) => console.log(error));

fetch()方法中的第二个参数是选项，它们是可选的。如果用户没有传参，则请求始终会得到，并且它将从给定的URL下载内容。如上所述，promise返回响应对象，因此，用户需要使用另一种方法来获取响应主体。用户可以根据请求体的格式使用几种不同的方法。

• response.json()
• response.text()
• response.blob()
• response.formData()
• response.arrayBuffer()

最受欢迎的是response.json()。
不幸的是，内置fetch()函数不在Node.js中，但是有一个类似于node-fetch的polyfill函数。在节点获取和浏览器之间的fetch()函数，存在几种不同的形式。

Axios

Axios是一个现代化第三方库，可以向Node或XMLHttpRequest或浏览器发送HTTP请求。作为现代图书馆，它基于Promise API。Axios具有一些优势，例如可以防止跨站点请求伪造（CSFR）攻击。为了能够使用Axios库，用户可以使用CDN，npm，Yarn或Bower安装它并将其导入到您的项目中。

axios.get(url)
  .then((response) => console.log(response))
  .catch((error) => console.log(error));

上面的代码是一个get方法以及一个用于响应和错误的简单回调。用户创建配置对象时，可以定义一堆属性。最常见的是url，baseURL，params，auth，headers，responseType，和data。
作为响应，Axios返回一个响应对象或错误对象的promise。在响应对象中，有以下几个值：

• data： 实际响应体
• status：返回的HTTP状态代码，例如200或404
• statusText：做为文本消息的HTTP状态
• headers：与请求相同
• config：请求配置
• request：XMLHttpRequest（XHR）对象

axios({
  url: "http://api.com",
  method: "POST",
  header: {
    "Content-Type": "application/json",
  },
  data: { name: "Sabesan", age: 25 },
});

在fetch()中，用户需要在中使用两个promise。用户可以避免重复，并在Axios中编写更简洁明了的代码。

Axios使用data属性，但fetch()使用body属性来处理数据。fetch()的data是字符串化。在fetch()中，URL作为请求参数，但是在Axios中，URL是配置对象。

JSON格式

Fetch

使用fetch()方法，用户需要使用一些方法对响应数据进行处理。当用户发送请求体时，用户需要对数据进行字符串化。

fetch('url')
  .then((response) => response