[每日一题] 简述 AJAX 的原理

Posted 2021-03-29 前端做题家

不知道大家是不是和我一样，一看到原理类的题目就头疼，不知道该怎么答，答哪些方面，无从下口。

记得某位大佬总结过原理类题目的答题流程，大致如下：

1. 首先把英文简写翻译成中文并用一句话描述该技术的用途

2. 描述该技术的核心概念或运作流程

3. 口述该技术的代码书写思路

4. 该技术的优点及缺点

5. 如何弥补缺点

套用上面的模板我们回答一下这个题目：

1. AJAX 就是异步 JS 和 XML 的缩写（目前我们一般用 JSON 代替 XML），主要用于在不刷新页面的情况下异步向服务器发起请求并接受响应，最后局部更新页面。
   

2. 该技术最核心概念是 XMLHttpRequest 对象，该对象可发起 HTTP 请求，我们可以监听其 readystate 的变化获得响应。
   

3. 具体代码是

• 先创建一个 XMLHttpRequest 对象。

• 调用 open 方法创建一个新的 HTTP 请求，并指定该请求的方法、URL 以及是否为异步请求。

• 绑定 callback 到 onreadystatechange 事件，该事件会在 readyState 属性发生改变时触发，因此在 callback 函数中可以根据 readyState 的值（是否等于4）对返回数据进行处理。

• 调用 send 方法发送 HTTP 请求

4. 该技术的优点是页面无需刷新，用户体验好；缺点是被浏览器限制不能跨域

5. 可以使用 JSONP 或 CORS 解决跨域问题

之后面试官可能又会问 JSONP 或 CORS 的原理，只要按照上面模板答就行了。

That's all, so easy ! 妈妈再也不用担心我的学习啦。。。