function itheima(options) {
// 创建构造函数
const xhr = new XMLHttpRequest();
// 打印形参
console.log(options);
// 打印 看看
// console.log(options.params);
// 如果查询参数有值 判断查询还是新增
if (options.params) {

// console.log(options.params);
//   定义数组 装着对象的值
let qs = [];
// 遍历对象获取key
for (let key in options.params) {
  // 获取键
  //   console.log(key);
  // 获取值
  //   console.log(options.params[key]);
  //   将键值对拼接 添加到数组中
  qs.push(`${key}=${options.params[key]}`);
}
//   打印看看qs数组的值
console.log(qs);
if (qs.length > 0) {
  // 看看join 转换后的拼接的字符串
  //   console.log(qs.join('&'));
  // 把 options.url的值 赋给 xhr.open()
  //   options.url = options.url + `?${qs.join('&')}`;
  //   简化写法
  options.url += `?${qs.join('&')}`;
  // 打印看看
  //   console.log(options.url);
}

}

// 将形参中的值 请求方法 请求地址 放入请求中
xhr.open(options.method, options.url);

// 判断请求类型

// 先把用户输入的请求方式 转为大写字母 并且 不是GET请求 并且 有data新增对象
if (options.method.toUpperCase() !== 'GET' && options.data) {

//   1.判断是否为 FormData
if (options.data instanceof FormData) {
  console.log(options.data);
  xhr.send(options.data);
}

//   2.判断data是否为字符串类型
else if (typeof options.data === 'string') {
  // 定义请求类型
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.send(options.data);
}

// 3.判断data是否为对象类型
else if (typeof options.data === 'object') {
  // 定义请求类型
  xhr.setRequestHeader('Content-Type', 'application/json');
  //   xhr.send(options.data);
  xhr.send(JSON.stringify(options.data));
}

} else {

xhr.send();

}
// 发送请求
// 监听结果
xhr.addEventListener('load', function () {

// console.log(JSON.parse(xhr.response));
//   将结果字符串转为对象
const res = JSON.parse(xhr.response);
// 返回给 success 函数  传实参
options.success(res);

});
}

最后修改:2021 年 11 月 15 日 06 : 05 PM
END
本文作者:
文章标题:封装属于自己的ajax请求-2021/11/14
本文地址:https://zhougewk8.cn/14.html
版权说明:若无注明,本文皆Dg's blog-专注健康快乐每一天原创,转载请保留文章出处。
如果觉得我的文章对你有用,请随意赞赏