ajax封装

Get方法封装
1.普通封装

function ajaxGet(url,callback){
		var xhr = new XMLHttpRequest();
		xhr.open('GET',url);
		xhr.send(null);
		xhr.onload = function(){
		    if(xhr.status==200){
		    	callback(xhr.response);
			}
		}
}

调用：

 ajaxGet('请求路径'，function(res){
		console.log(res);
   })

2.结合promise封装

function ajaxGet(url){
	return new Promise(function(success,failed){
		var xhr = new XMLHttpRequest();
		xhr.open('GET',url);
		xhr.send(null);
		xhr.onload = function(){
			if(xhr.status == 200){
				success(xhr.response);
			}
		}
	})
}

调用：

ajaxGet("请求路径")
         .then(function(res){
            console.log(res);
            console.log(JSON.parse(res));
            return ajaxGet("请求路径");
        })
         .then(function(res){
            console.log(res);
        })  

Post方法封装
1.普通方法封装

function ajaxPost(url,data,callback){
		var xhr = new XMLHttpRequest();
    xhr.open('POST',url);
    xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8');
		xhr.send(data);
		xhr.onload = function(){
		    if(xhr.status==200){
		    	callback(xhr.response);
			}
		}
}

调用：

ajaxPost('请求路径',data,function(res){
    		console.log(res);
       })

2.结合promise封装

  function ajaxPost(url,data){
         return new Promise(function(success){
			var xhr = new XMLHttpRequest();
			xhr.open('POST',url);
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8');
			xhr.send(data);
			xhr.onload = function(){
				if(xhr.status == 200){
					success(xhr.response);
				}	
			}
		 })  
        }

调用：

ajaxPost("请求路径",data)
  .then(function(res){
    console.log(res);
    console.log(JSON.parse(res));
    return ajaxPost("请求路径",data);
})
  .then(function(res){
    console.log(res);
})