使用 AJAX 封装接口并发送 HTTP 请求，将数据作为请求参数发送到指定的 URL

1、创建XMLHttpRequest对象：

var xhr = new XMLHttpRequest();

2.创建一个处理响应的回调函数：

xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // 请求成功，处理响应数据
    var responseData = JSON.parse(xhr.responseText);
    // 进行后续操作
  } else {
    // 请求失败或正在处理中
  }
};

xhr.readyState和xhr.status是用于判断HTTP请求状态和响应状态的属性

• xhr.readyState 表示 XMLHttpRequest 对象的状态，它有以下几个可能的值：
  • 0：未初始化。XMLHttpRequest 对象已创建或已被 abort() 方法重置。
  • 1：打开。已调用 open() 方法，但尚未调用 send() 方法。
  • 2：发送。已调用 send() 方法，但尚未接收到响应。
  • 3：接收。正在接收响应数据，部分数据已经可用。
  • 4：完成。响应数据已完全接收。

• xhr.status 表示响应的 HTTP 状态码，例如 200 表示成功，404 表示未找到，500 表示服务器错误等。

因此，xhr.readyState === 4 && xhr.status === 200 的条件判断表示当请求的状态为完成（readyState 为 4）且响应的状态码为 200 时，执行特定的操作。通常这意味着请求成功并且服务器返回了正常的响应。

JSON.parse()方法将xhr.responseText()中的JSON字符串解释为JavaScript对象或者数组，并将其赋值给变量responseData，经过转换后，我们就可以直接访问responseData变量中的属性和值了。

3.构建请求URL和数据：

var url = "your_api_url";
var data = { a: "value", b: ["a", "b"], c: { d: ["a", "b"] } };
var requestData = JSON.stringify(data);  // 将数据对象转换为 JSON 字符串

4.设置请求方法和URL，并发送请求：

xhr.open("POST", url, true);  // true 表示异步请求
xhr.setRequestHeader("Content-Type", "application/json");  // 设置请求头
xhr.send(requestData);  // 发送请求