AJAX五步曲

0.引言

AJAX展开缩写后是Asynchronous JavaScript and XML，即异步的JS和XML，它给JavaScript带来了巨大的变化，按照以下五步，你将能够完整实现一个AJAX。

1.创建xhr对象

var xhr = new XMLHttpRequest();

2.创建链接

xhr.open('method', 'url');

3.发送请求

xhr.send(data);

4.监听连接状态&获取响应

//监听连接状态变化
xhr.onreadystatechange = () => {
  if (xhr.readystate === 4){
    //响应处理完毕
    //默认服务器返回JSON字符串
    //callback传入实参
    callback(JSON.parse(xhr.responseText));
  }else{
    console.log(xhr.status);
  }
}

拓展介绍：
readyState不同的取值表示的含义：
0.初始化状态
1.发送请求
2.请求发送完成，已经接收到全部响应
3.正在处理响应内容
4.响应处理完毕

5.使用响应数据

//定义回调函数使用响应数据
//定义形参
function callback(response){
  console.log(response);
}

6.结语

听起来特别高大上的AJAX通过以上五步就可以完成啦，不过要注意一个细节，请求的方法不同xhr相关方法传入的参数也就不同，这点希望你能在后期自行多做尝试，试着去实现一个自己的AJAX吧。

PS：版权归作者所有，如需转载请注明出处。