9.ajax

9-1 原生ajax

var url="http://192.168.4.18:8000/";
var xhr=new XMLHttpRequest();
xhr.open("get",url,true);
xhr.send();
xhr.onreadystatechange=function(){
    if(xhr.status==200&&xhr.readyState==4){
        var obj=JSON.parse(xhr.responseText);
        console.log(obj)
    }
}

9-2 封装的ajax

function ajax({
  url,
  method="get",
  success
}) {
  var xhr = new XMLHttpRequest();
  xhr.open(method, url, true);
  xhr.send();
  xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
      var result = JSON.parse(xhr.responseText);
      success(result)
    }
  }
}

9-3 jquery-ajax

$.ajax({
  url:"http://192.168.4.18:8000/",
  type:"get",
  dataType:"json",
  success:res=>{
    console.log(res)
  }
})

9-4 callback封装ajax

function http({
    url,
      type="get",
      success
}){
    $.ajax({
      url,
      type:"get",
      datatype:"json",
        success:res=>{
            success(res)
        }
    })
}

9-5 promise封装ajax

function http(url){
    return new Promise((resolve,reject)=>{
        $.ajax({
            url:`http://192.168.4.18:3000/${url}`,
            type:"get",
            success:res=>{
                resolve(res)
            },
            error:err=>{
                reject(err)
            }
        })
    })
}