原生js实现ajax

function ajax(options){
//   let {url,success,err,data,dataType,type}=options
   
  let xhr= new XMLHttpRequest()   // XMLHttpRequest 对象用于在后台与服务器交换数据
//   xhr.readyState：0
  options.data=options.data||{}
  options.dataType=options.dataType||'text'
  options.type=options.type||'GET'
  
  //  简单的数据处理
  let arr=[]
  for(let name in options.data){
      arr.push(`${name}=${options.data[name]}`)
  }

  let strData=arr.join('&')


    // 初始化 HTTP 请求参数，例如 URL 和 HTTP 方法，但是并不发送请求。
    // xhr.open(methods，url,async,username,password),
    // method 用于清秀http方法 ，eg:post,get..
    // url 请求的主体（路径）。大多数要求同源安全策略
    // async 知识该请求是同步还是异步的，false:同步，对后续的send（）调用将阻塞，直到响应完全接受。true：异步
    // password，userName 参数可选，为url 所需的授权提供认证资格，如果指定了，将会覆盖url 自己指定的任何资格
 if(options.type==='GET'){
     //  GET请求方式数据在url上
     
    xhr.open(options.type,options.url+'?'+strData,true)
    //   xhr.readyState：1
    xhr.send()
     //   xhr.readyState：2
 }else{
    xhr.open('POST',options.url,true)
    xhr.setRequestHeader('content-type','application/x-www-form-urlencode')
    xhr.send(strData)   // 发送的是内容在请求体里
 }
// onreadystatechange：每次 readyState 属性改变的时候调用的事件句柄函数。当 readyState 为 3 时，它也可能调用多次。
  xhr.onreadystatechange=function(){
    // readyState：HTTP 请求的状态.当一个 XMLHttpRequest 初次创建时，这个属性的值从 0 开始，直到接收到完整的 HTTP 响应，这个值增加到 4。
      if(xhr.readyState===4){ // HTTP 响应已经完全接收。
      //status:由服务器返回的 HTTP 状态代码，如 200 表示成功，而 404 表示 "Not Found" 错误。当 readyState 小于 3 的时候读取这一属性会导致一个异常。
         if(xhr.status===200||xhr.status===305){
             // responseText:目前为止为服务器接收到的响应体（不包括头部）
            options.success&&options.success(xhr.responseText)
         }else{
            options.error&&options.error()
         }
      }
  }

}