Question

我有一个功能，可以从服务器请求数据并打开一个页面。并返回页面索引。称为-showpage（）。我也有方法-active（）（返回当前打开的页面索引），next（）和previous（）

因此，幕后的下一个和上一个方法会执行showpage（）方法。

但是问题是当我执行这种类型的脚本时：

console.log(active());
showpage(9998)
console.log(active());
console.log(next());
console.log(active());

它应该输出我：

0， 9998 9999 9999

但是相反，它给了我一些绝对错误的信息。我知道这与服务器请求有关，这些请求较早完成-正在弄乱结果。

所以我创建了一个简单的小提琴，以显示我的问题：

https://jsfiddle.net/xpvt214o/875828/

这是一个小样本：

button.on("click", function(){
    makeRequest("https://jsonplaceholder.typicode.com/photos", 1);
    makeRequest("https://jsonplaceholder.typicode.com/comments", 2);
    makeRequest("https://jsonplaceholder.typicode.com/todos", 3);
    makeRequest("https://jsonplaceholder.typicode.com/albums", 4);
    makeRequest("https://jsonplaceholder.typicode.com/users", 5);
})

function makeRequest(url, id){
    $.ajax({
        url: url,
    })
.done(function( data ) {
    console.log(id);
 });
}

因此输出应为：

1， 2， 3， 4， 5

项目中没有jQuery，在这里只是添加了一个快速示例

有没有一种方法可以轻松地使它们排在队列中？类似于C＃中的SemaphoreSlim吗？

Answer 1

这里是使用递归编码的更新，用于维护序列。我们填写了一系列请求，然后逐个处理它们，直到没有更多

var reqArr= [];

button.on("click", function(){
  reqArr.push({url:"https://jsonplaceholder.typicode.com/photos",v:1});
  reqArr.push({url:"https://jsonplaceholder.typicode.com/comments",v:2});
  reqArr.push({url:"https://jsonplaceholder.typicode.com/todos",v:3});
  reqArr.push({url:"https://jsonplaceholder.typicode.com/albums",v:4});
  reqArr.push({url:"https://jsonplaceholder.typicode.com/users",v:5});
  makeRequest();
})

function makeRequest(){
  if(reqArr.length==0) return;//stop recursion
  var obj=reqArr.shift();

  $.ajax({
    url: obj.url,
  })
  .done(function( data ) {
    console.log(obj.v);
    return makeRequest();
  });
}

JavaScript根据请求制作队列

1 个答案: