Ajax面试

Ajax是什么?

Ajax是JavaScript基于XMLHttpRequest对象向服务端发送异步请求,并且能获取和处理后端返回的数据,它可以实现页面的局部刷新。Ajax是异步发送请求的,所以不阻碍用户的其他操作,具有快速的响应能力,页面无刷新或者局部刷新提高了用户的体验度,而无需加载完整的页面也减轻了服务器和宽带的压力,与JSON轻量级的存储方式结合,方便对数据的解析,并且Ajax拥有众多库,如jQuery AJAX,Axios,上手方便。

Ajax的工作流程?

  1. JS通过XMLHttpRequest向后端发送异步请求。
  2. 服务器端接受请求,处理并返回数据。
  3. JS通过XMLHttpRequest获取并解析服务器端,返回的数据内容。
  4. js通过动态更新DOM或者其他。

Ajax有哪些弊端?

  1. 不支持浏览的后退功能,破坏浏览器后退机制。
  2. 浏览器不兼容,在浏览器下需做兼容处理。
  3. 因为数据是由后台返回,对搜索引擎优化不友好。
  4. 使用不当,会增大网络的请求数量,需要配合防抖 ,节流等性能优化。

Ajax的实现

创建Ajax对象(初始化对象)

var xhr=new XMLHttpRequest()

调用open方法打开TCP连接

xhr.open("请求方式","请求地址?key=value&key2=value2",true(异步)/false(同步))

 设置onreadystatechange事件

//当Ajax的状态码发生改变时即可出发该事件 可多次调用
xhr.onreadystatechange=function(){
xhr.readyState//获取Ajax的状态码
//Ajax的状态码有0~4
//0---刚初始化xhr
//1---调用了open方法,打开了TCP连接,请求未发送
//2---响应头回来了,请求发送了
//3---响应正文接收到一部分,请求处理中
//4----响应正文全部验收完毕
//xhr.status属性可获取HTTP状态码,服务器端返回
//xhr.status==200(状态请求成功)
}

发送请求

xhr.send()
原文地址:https://www.cnblogs.com/huangla/p/14154336.html