关于前端:axiosXHRXMLAJAX和Fetch分不清怎么办

由面试引出的问题：

axios 是基于什么技术进行封装的？那 xhr 的全称是什么？还有哪些办法？还有什么发申请的库吗？

不堪称作死连环问~

axios

axios 是一个轻量的 HTTP客户端 ，它基于 XMLHttpRequest 服务（浏览器）来执行 HTTP 申请，反对丰盛的配置，反对 Promise，反对浏览器端和 Node.js 端。在服务器端它应用本机 node.js http 模块，而在客户端（浏览器）它应用 XMLHttpRequests。

特点

• 从浏览器收回XMLHttpRequests
• 从 node.js 收回 http 申请
• 反对 Promise API
• 拦挡申请和响应
• 转换申请和响应数据
• 勾销申请
• JSON 数据的主动转换
• 客户端反对避免XSRF

引出问题，什么是 XHR

XHR (XMLHttpRequest)

XMLHttpRequest（XHR）对象用于与服务器交互。通过 XMLHttpRequest 能够在不刷新页面的状况下申请特定 URL，获取数据。这容许网页在不影响用户操作的状况下，更新页面的部分内容。XMLHttpRequest 在 AJAX 编程中被大量应用。

只管名称如此，XMLHttpRequest 能够用于获取任何类型的数据，而不仅仅是 XML。它甚至反对 HTTP 以外的协定（包含 file:// 和 FTP），只管可能受到更多出于平安等起因的限度。

深究一下，XML 是什么？

XML

可扩大标记语言（Extensible Markup Language，XML）是一种标记语言。XML 是从规范通用标记语言（SGML）中简化批改进去的。它次要用到的有可扩大标记语言、可扩大款式语言（XSL）、XBRL 和 XPath 等。

XML 设计是用来传送和携带数据信息，不用于体现和展现数据，HTML 则用来体现数据，所以 XML 用处的焦点是在于阐明数据是什么以及携带数据信息。 然而 XML 及其扩大常常因简短、简单和冗余而受到批评。

JSON、YAML 和 S -Expressions 常常被提出作为更简略的代替计划，它们专一于示意高度结构化的数据而不是文档，文档可能同时蕴含高度结构化和绝对非结构化的内容。然而，与更简略的序列化格局相比，W3C 标准化的 XML 模式标准提供了更宽泛的结构化 XSD 数据类型，并通过 XML 命名空间提供了模块化和重用。

前文提到，AJAX 是？

AJAX (Asynchronous JavaScript And XML)

AJAX（Asynchronous JavaScript And XML，异步 JavaScript 和 XML）是一种应用 XMLHttpRequest 技术构建更简单，动静的网页的 编程实际。

AJAX 容许只更新一个 HTML 页面的局部 DOM，而无须从新加载整个页面。AJAX 还容许异步工作，这意味着当网页的一部分正试图从新加载时，您的代码能够持续运行（相比之下，同步会阻止代码持续运行，直到这部分的网页实现从新加载）。

通过交互式网站和古代 Web 规范，AJAX 正在逐步被 JavaScript 框架中的函数和官网的 Fetch API 规范取代。

那么原生 Fetch 是？

新秀 Fetch

Fetch 是一种新的用于获取资源的技术，是浏览器提供的原生 AJAX 接口。因为原来的 XMLHttpRequest 不合乎关注拆散准则，且基于事件的模型在解决异步上曾经没有古代的 Promise 等那么有劣势，因而 Fetch 呈现来解决这种问题。

Fetch 应用起来很简略，它返回的是一个 Promise，即便你没有 XHR 的开发教训也能疾速上手。在 Fetch 中有四个基本概念，他们别离是 Headers、Request、Response 和 Body。在一个残缺的 HTTP 申请中，其实就曾经蕴含了这四个概念。

进一步学习返回 Fetch API

fetch 的长处：

• 基于规范 Promise 实现，反对 async/await。
• 更加底层，提供的 API 丰盛，易上手。
• 脱离了 XHR，是 ES 标准里新的实现形式。

fetch 的毛病：

• fetch 只对网络申请报错，对 400，500 都当做胜利的申请，服务器返回 400，500 错误码时并不会 reject，只有网络谬误这些导致申请不能实现时，fetch 才会被 reject。
• fetch 默认不会带 cookie，须要增加配置项。
• fetch 不反对 abort，不反对超时管制。
• fetch 没有方法原生监测申请的进度，而 XHR 能够。
• 其余兼容性问题。

补充：其余用于发动申请的库

• SuperAgent
• request
• Supertest

疾速总结

• axios 是一个轻量的 HTTP客户端，它基于 XMLHttpRequest 服务，反对丰盛的配置，反对 Promise。
• AJAX 不是新的编程语言，而是一种应用现有规范的 新办法（编程实际），底层应用了宿主环境的（XHR）。
• fetch 不是对 AJAX 的进一步封装，而是原生 JavaScript，没有应用 XMLHttpRequest 对象。Fetch API 提供了一个 JavaScript 接口，用于拜访和操纵 HTTP 管道局部。
• XHR 是过来和当初很多网络申请计划、工具库的根底，能够用于获取任何类型的数据，而且不仅仅是 XML。