JavaScript箭头函数无法访问外部变量，多页API数据存数组失败求助

嘿，我来帮你捋捋为啥你的代码只能拿到第一页数据，还没法把所有结果存进数组里～

核心问题原因 #

1. 异步请求的流程没处理对
   axios的GET请求是异步操作，如果你的代码只是简单地循环调用axios，没有等待前一个请求完成就继续，会导致页码混乱，甚至后续请求根本没触发——毕竟异步代码不会按你写的顺序同步执行。

2. 缺少分页判断逻辑
   你只初始化了pageNumber = 1，但没根据API返回的结果判断是否还有下一页。比如很多分页API会返回总页数、是否有更多数据的标识，你得用这些信息来决定要不要继续请求下一页。

调整后的可行代码 #

下面是用async/await处理异步流程，加上分页判断的完整代码，能自动请求所有页并把title都存进数组：

const axios = require("axios");

async function fetchAllMovieTitles() {
  let pageNumber = 1;
  const titles = [];
  const valueToSearch = 'love';
  let hasNextPage = true;

  while (hasNextPage) {
    try {
      // 替换成完整的API URL，确保带page参数
      const apiUrl = `https://jsonmock.hackerrank.com/api/movies/search/?Title=${valueToSearch}&page=${pageNumber}`;
      const response = await axios.get(apiUrl);
      const apiData = response.data;

      // 把当前页的所有title推入数组
      apiData.data.forEach(movie => titles.push(movie.Title));

      // 判断是否还有下一页：对比当前页码和总页数
      hasNextPage = pageNumber < apiData.total_pages;
      pageNumber++;
    } catch (error) {
      console.error(`请求第${pageNumber}页失败：`, error.message);
      hasNextPage = false; // 出错后停止请求，避免死循环
    }
  }

  console.log("所有搜索到的标题：", titles);
  return titles;
}

// 调用函数开始请求
fetchAllMovieTitles();

代码关键点说明 #

• async/await同步化异步流程：确保每一页请求完成后，再处理下一页的请求，不会出现页码跳变的问题。
• 分页判断：通过API返回的total_pages字段（不同API可能叫total或has_more，根据实际情况调整）来决定是否继续请求。
• 错误处理：用try/catch捕获请求异常，避免某一页请求失败导致整个程序崩溃。
• 数组更新：在每一页请求成功后，直接把当前页的title推入数组，确保所有数据都被收集。

额外注意事项 #

• 确认你的API URL正确拼接了page参数，大部分分页API都需要通过query参数指定页码。
• 如果API有请求频率限制，可以在每次请求后加个小延迟，比如await new Promise(resolve => setTimeout(resolve, 500))，避免被限流。

内容的提问来源于stack exchange，提问作者abankitbaid