小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。
👨面试官：“ajax的原理晓得吗？？”
👩我：“……” (平常的时候好像一直都在关注ajax是怎么用的、要怎么封装等这样的问题，突然一下子被“原理”两个字痛击到了！)
既然不懂，那就一起来搞懂它吧！☑
先来一段 MDN 的原话，看看Ajax是个什么
AJAX 即 Asynchronous Javascript And XML（异步JavaScript和XML）
Asynchronous JavaScript + XML（异步JavaScript和XML）, 其本身不是一种新技术，而是一个在 2005年被Jesse James Garrett提出的新术语，用来描述一种使用现有技术集合的‘新’方法，包括: HTML 或 XHTML, CSS, JavaScript, DOM, XML, XSLT, 以及最重要的
XMLHttpRequest。当使用结合了这些技术的AJAX模型以后， 网页应用能够快速地将增量更新呈现在用户界面上，而不需要重载（刷新）整个页面。这使得程序能够更快地回应用户的操作。
工作原理
在传统的Web应用程序当中，浏览器本身负责初始化到服务器的请求，并处理来自服务器的响应，而Ajax模型不同，它提供了一个中间层（Garrent称之为Ajax引擎）来处理这种通信。
Ajax引擎（Ajax engine）实际上只是一个Javascript对象或函数，只有当信息必须从服务器上获得的时候才调用它。与传统的模型不同，不再需要为其它资源（比如其它网页）提供链接，而是当需要调度和执行这些请求的时候，向Ajax引擎发出一个函数调用。
最最最重要的是，这些请求都是异步完成的，就意味着不必等到收到响应之后就可以继续执行后面的代码。
服务器向Ajax引擎返回其可用的数据，这些数据可以是纯文本、XML或者需要的任何格式（我们目前一般都采用JSON的格式），对于Ajax引擎来说，唯一的要求就是它都够理解和翻译这些数据。
当Ajax引擎收到服务器响应的时候，它自己会进行一系列的动作，这些动作一般是完成数据解析，以及基于其所提供的数据对用户界面做一些修改。由于这个过程中传递的信息比传统的Web应用程序模型要少很多，因此对用户来说，界面更新的就更快，下面是两张关于传统和Ajax引擎的对比图：
传统Web应用程序模型
Ajax Web应用程序模型
Ajax引擎中包含了很多的技术，但是里面最重要的就是XmlHttpRequest对象。所以我们可以把Ajax引擎笼统地看作是一个XmlHttpRequest对象，所以就可以用一句话来概括Ajax所做的事情——通过XmlHttpRequest对象来向服务器发送异步请求，从服务器获得数据，然后用JavaScript来操作DOM而更新页面。
其中发挥重要作用的就是XmlHttpRequest对象，所以在使用Ajax当中我们必须要对XmlHttpRequest对象的常用属性都要熟记于心。本文重在讲解原理，在这里我就不一一列举了，随便找一遍关于Ajax的文章都会跟你解释，不过建议看MDN->XMLHttpRequest - Web API 接口参考 | MDN (mozilla.org)
作为前端一分子，这个对象的重要性是不言而喻的，所以如果还没有搞熟练，那就现在把它搞得熟透透的吧！🤡🤡🤡
