AJAX的封装和二次封装

传统的AJAX请求

//get请求
var xhr = new XMLHttpRequest();
xhr.open("get","url"+"?"+data,true);    //get方法将请求的数据以字符串拼接的方式放在地址后面
xhr.send();
xhr.onreadystatechange = function (){
   
	if(xhr.readyState==4&&xhr.status==200){
   
     	 var result = xhr.responseText;    //result请求的数据  
     	 result = JSON.parse(xhr.responseText);  //将请求的数据通过json的方法解析       
    }
}
//post请求
var xhr = new XMLHttpRequest();
xhr.open("get","url",true);    
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//上面这行是发送post请求时所需要的
xhr.send(data);   //post请求将数据放在发送行
xhr.onreadystatechange = function (){
   
	if(xhr.readyState==4&&xhr.status==200){
   
     	 var result = xhr.responseText;    //result请求的数据  
     	 result = JSON.parse(xhr.responseText);  //将请求的数据通过json的方法解析       
    }
}

我们写的页面 大多有很多次请求，如果每次都这样写的话 就会产生大量的代码冗余，所以就会有ajax的封装，方便我们的使用，提升代码运行效率。

ajax的第一次封装

ajax.js
模拟jQuery方法封装

let $ = {
   
    ajax:function(options = {
   }){
       //将请求的数据以对象的形式传进来
        var {
   type = "get",url="",data="",async=true,dataType="text",success}=options;
   		//将数据解析 默认get方法请求 默认异步操作 默认文本类型text success 回调函数
        var xhr = new XMLHttpRequest();
        if(typeof data == "object"){