前端每日一练：使用 Promise 封装 AJAX 请求

// 封装 AJAX 请求的函数
function fetchData(url, method = 'GET', data = null) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open(method, url);
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve(xhr.responseText);
      } else {
        reject(new Error(`Request failed: ${xhr.statusText}`));
      }
    };
    xhr.onerror = () => {
      reject(new Error('Network error'));
    };
    if (method === 'POST') {
      xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    }
    xhr.send(data);
  });
}
 
// 使用封装后的函数发送请求
fetchData('https://api.example.com/data')
  .then(response => {
    console.log('数据请求成功:', response);
  })
  .catch(error => {
    console.error('数据请求失败:', error.message);
  });

这段代码展示了如何使用Promise封装一个简单的AJAX请求函数，并在使用时通过.then()和.catch()处理请求结果。这是现代JavaScript开发中的一个常见模式，对于学习如何与异步操作交互非常有帮助。