ajax--封装自己的ajax函数``` //html文件查看数据 //js文件 function parseObje

//html文件
<body>
    <button>查看数据</button>
    <script src="../02-myajax.js"></script>
    <script>
        let btn = document.querySelector('button')
        btn.addEventListener('click',function(){
            ajax({
                method:'get',
                url:'http://www.itcbc.com:3006/api/getbooks',
                params:{id:15655},
                success:function(res){
                    console.log(res);
                }
            })
        })
    </script>
    
    
//js文件
function parseObjectToString(obj) {
  let arr = []
  for (let key in obj) {
    arr.push(key + '=' + obj[key])
  }
  //arr.join()把元素以&符号分隔
  return arr.join('&')
}

// option.method:请求方式
// option.url:请求地址
// option.params:url参数
// option.data:请求体参数
// success:请求成功之后的回调函数
function ajax({ method, url, params, data, success }) {
  // 1.创建异步对象
  let xhr = new XMLHttpRequest()
  // 2.使用异步对象发起请求
  // 2.1 设置请求行
  if (method.toLowerCase() == 'get' && params) {
    url += '?' + parseObjectToString(params)
  }
  xhr.open(method, url)
  // 2.2 设置请求头
  // 2.3 设置请求体
  // instanceof:判断一个的构造函数是否是某个构造函数，意味着判断对象是否是某个构造函数创建的
  //data是判断数据类型
  if (data instanceof FormData) {
    // 说明传递了formdata ,不用设置请求头
    xhr.send(data)
  } else if (typeof data == 'object') {
    // 说明传递了一个对象
    xhr.setRequestHeader('Content-Type', 'application/json')
    xhr.send(JSON.stringify(data))
  } else if (typeof data == 'string') {
    // 说明这里传递了key=value&key=value
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
    xhr.send(data)
  } else {
    xhr.send()
  }

  // 3.使用异步对象接收响应
  xhr.addEventListener('load', function() {
    // 调用用户传入的回调函数，且将后台的响应数据做为参数回传
    success(JSON.parse(xhr.response))
  })
}

</body>