Promise基础介绍及封装AJAX请求

// 封装AJAX请求的函数
function fetchData(url) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve(xhr.responseText);
      } else {
        reject(new Error(`Error: ${xhr.status}`));
      }
    };
    xhr.onerror = () => reject(new Error('Network Error'));
    xhr.send();
  });
}
 
// 使用封装的函数
fetchData('https://api.example.com/data')
  .then(response => console.log(response))
  .catch(error => console.error(error));

这段代码定义了一个fetchData函数，它接受一个URL作为参数，并返回一个Promise对象。这个Promise在AJAX请求完成时通过调用resolve来解决，并传递响应数据；如果请求失败或者发生网络错误，则通过调用reject来拒绝，并传递错误信息。使用这个函数时，我们通过.then()来处理成功的情况，通过.catch()来处理错误的情况。这是Promise的一个基本用法示例。