如何在多个文件下载时取消一个文件的异步下载？

// 存储下载文件的列表
let downloadList = [];

// 异步下载文件的函数
function downloadFile(url, fileId) {
  // 创建下载任务
  let xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  
  // 监听下载进度等事件
  xhr.onloadstart = function() {
    // 更新文件的下载状态为进行中
    updateDownloadStatus(fileId, '进行中');
  };
  
  xhr.onload = function() {
    // 下载完成后的处理逻辑
    // ...
    // 更新文件的下载状态为已完成
    updateDownloadStatus(fileId, '已完成');
  };
  
  xhr.onerror = function() {
    // 下载出错的处理逻辑
    // ...
    // 更新文件的下载状态为出错
    updateDownloadStatus(fileId, '出错');
  };
  
  // 发起下载请求
  xhr.send();
  
  // 将下载任务添加到下载列表
  downloadList.push({ id: fileId, xhr: xhr });
}

// 取消文件的异步下载
function cancelDownload(fileId) {
  // 查找对应的下载任务
  let downloadTask = downloadList.find(task => task.id === fileId);
  
  if (downloadTask) {
    // 取消下载任务
    downloadTask.xhr.abort();
    
    // 更新文件的下载状态为取消
    updateDownloadStatus(fileId, '取消');
    
    // 从下载列表中移除该文件
    downloadList = downloadList.filter(task => task.id !== fileId);
  }
}

// 更新文件的下载状态
function updateDownloadStatus(fileId, status) {
  // 更新文件的下载状态，例如更新页面上的下载状态显示
  // ...
}

// 示例使用：
downloadFile('http://example.com/file1.txt', 'file1');
downloadFile('http://example.com/file2.txt', 'file2');
downloadFile('http://example.com/file3.txt', 'file3');

// 取消文件2的下载
cancelDownload('file2');