用于获取维基百科数据的Javascript循环未终止

Question

我一直在研究一个相当大的 JavaScript 函数，当我最终认为它已经完成时，它完全停止工作了。

这里是:

function getLinksFrom(title) {
  var returnArray = [],
      plcontinue = '',
      url = 'http://en.wikipedia.org/w/api.php?action=query&prop=links&titles=' + title + '&format=json&pllimit=500&plnamespace=0&callback=?';
  while (returnArray.length === 0 || plcontinue !== '') {
      if (plcontinue !== '') {
          url = 'http://en.wikipedia.org/w/api.php?action=query&prop=links&titles=' + title + '&format=json&pllimit=500&plnamespace=0&plcontinue=' + plcontinue + '&callback=?';
      }
      $.ajax({url: url, 
          dataType: 'json',
          success: function(data) {
              console.log(data);
              for (key in data['query']['pages']) {
                  links = data['query']['pages'][key]['links'];
              }
              for (var i = 0; i < links.length; i += 1) {
                  returnArray.push(links[i]['title']);
              }
              if (data.hasOwnProperty('query-continue')) {
                  plcontinue = data['query-continue']['links']['plcontinue'];
              } else {
                  plcontinue = '';
              }
          }
      });
  }
  return returnArray;
}

据我所知，它一定是陷入了 while 循环，因为页面卡住了。但随着每个循环，returnArray 都会增长，我正在使用不会将 plcontinue 设置为任何内容的东西来测试它。

知道出了什么问题吗？可能是异步加载的东西，我对此很陌生。

编辑:所以我通过有用的评论发现它会一次又一次地循环发出越来越多的请求，而无需等待ajax完成后再重新开始。我怎样才能阻止它这样做？

Answer 1

关键是 AJAX 是异步的。这意味着当 JS 需要执行请求时，它会发送请求并继续执行其余代码。请求完成后，将触发回调。

所以在你的代码中它会像这样工作:

1. 变量初始化
2. While 循环条件检查。条件为真，因此转到循环体。
3. 执行ajax请求。我们发送请求并继续。
4. 再次检查状况。由于没有任何变化(请求没有时间完成)，条件仍然为真。
5. 等等。

最终，也许十几个请求中的一个会结束，修改 returnArray 和 plcontinue，但这可能需要很长时间，因为函数体内的内容是，基本上，无限(几乎)循环，占用大部分 CPU 资源。

解决方案是用递归代替迭代:您可以递归直到成功，而不是无限循环迭代直到成功。从 getLinksFrom 中删除 while 循环，并将 getLinksFrom() 添加到 ajax 请求回调中。

另一种方法是同步执行该请求。它有一个特殊的标志。