js用async封装XHR

在JS中，可以使用async函数来封装XHR请求。async函数是ES6中引入的一种异步编程方式，可以更方便地处理异步操作，使代码更加简洁易读。

以下是一个使用async函数封装XHR请求的示例代码：

async function request(url, method, data) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open(method, url);
    xhr.setRequestHeader('Content-Type', 'application/json');
    xhr.onreadystatechange = function() {
      if (xhr.readyState === 4) {
        if (xhr.status === 200) {
          resolve(JSON.parse(xhr.responseText));
        } else {
          reject(xhr.statusText);
        }
      }
    };
    xhr.onerror = function() {
      reject('Network Error');
    };
    xhr.send(JSON.stringify(data));
  });
}

// 使用示例
async function getData() {
  try {
    const result = await request('/api/data', 'GET');
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

async function postData() {
  try {
    const result = await request('/api/data', 'POST', { name: 'John' });
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

在上述代码中，request函数接收三个参数：请求的URL、请求方法和请求数据。该函数返回一个Promise对象，用于处理异步操作的结果。

在使用时，可以通过async/await语法来调用request函数，以获取异步操作的结果。如果异步操作成功，将返回请求的数据；如果异步操作失败，将返回错误信息。

以上是一个基本的异步请求示例，可以根据实际需求进行修改和扩展。