前端面试题-请求失败会弹出一个 toast , 如何保证批量请求失败，只弹出一个 toast

最新推荐文章于 2025-05-28 12:20:36 发布

原创

最新推荐文章于 2025-05-28 12:20:36 发布 · 638 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #面试 #职场和发展

哈喽小伙伴们大家好!我是爱学英语的程序员~今天继续为大家更新面试题系列文章~

请求失败会弹出一个 toast , 如何保证批量请求失败，只弹出一个 toast?

大家想一想,如果是你要到这个问题,你会怎样回答面试官?

废话不多说在这里先说说我的想法

方法一,计数器方法

维护一个计数器，记录当前还未处理的请求数量。每当发起一个请求时，计数器加一；每当请求完成（无论成功或失败），计数器减一。
在请求失败时，先检查计数器的值。如果计数器仍大于零，说明还有其他请求正在进行，此时不弹出新的 toast；只有当计数器归零时，才弹出一个 toast 提示请求失败。

let requestCount = 0;

function batchRequest() {
  // 模拟批量请求
  requestCount += 3; // 假设发起了3个请求

  // 假设每个请求的处理逻辑
  setTimeout(() => {
    requestCount--; // 模拟请求完成，无论成功或失败都减少计数器

    // 假设请求失败的处理
    if (requestCount === 0) {
      showToast("批量请求失败"); // 只在计数器归零时弹出一个 toast
    }
  }, 1000);
}

function showToast(message) {
  console.log("Toast:", message); // 实际项目中可能是弹出一个 UI 组件
}

batchRequest(); // 发起批量请求

方法二,使用async/await

使用 Promise.all 或 async/await：如果使用 Promise.all 或 async/await 来处理批量请求，可以利用 Promise.all 的特性，只有所有请求都完成（无论成功或失败），才进行后续操作，包括弹出 toast。
在每个请求的失败处理中，确保只有在所有请求完成后才执行弹出 toast 的操作。