使用延迟和传递变量链接多个 AJAX 调用

Question

我正在研究一种方法，将每个变量的一组 3 个 ajax 调用链接到一组数据，中间有一些延迟。

考虑到this answer.

我正在尝试更新代码以实现以下目标：

1. 在 b() 和 c() 函数中添加延迟

2. 将变量从 a() 传递到 b() 以及从 b() 传递到 c()

有没有一种方法可以使用全局变量将 a() 生成的变量传递给 b() 而不？如果不是这样也没关系，我只是想知道。

在处理 c() 之前，我究竟怎样才能让 b() 延迟几秒钟？我假设添加 setTimeout 会起作用，因为它会在启动 c() 之前等待承诺，但事实并非如此。

jsfiddle

function a(user, pass) {
  return $.post('/echo/json/', {}, function(re){
    console.log(1);
  });
}

function b() {
  setTimeout(function() {
    return $.post('/echo/json/', {}, function(re){
        console.log(2);
    });
  }, 3000);
}

function c() {
  console.log(3);
}

var data = [{u: 'au', p: 'ap'}, {u: 'bu', p: 'bp'}];

var counter = 0;

function main() {
  if(counter < data.length) {
    $.when(a(data[counter].u, data[counter].p).then(b).then(c)).done(function(){
      counter++;
      main();
    })
  }
}

main();

Answer 1

为确保在调用超时代码之前不会执行c()，请创建您自己的promise 并从b() 函数中返回它。您应该将setTimeout 函数包装在这个promise 中，并调用resolve(res) 方法来通知.then() 函数监视promise，并传递一个表示响应的data 或body 的对象。

function b(dataFromA) {
  return new Promise((resolve, reject) => {
    setTimeout(function() {
      return $.post('/echo/json/', {}, res => {
        let dataToB = res;
        console.log(2);
        resolve(dataToB);
      });
    }, 3000);
  });
}

请注意，b() 现在接受可以从a() 承诺的响应中传递的数据。您可以在调用b(res) 之前在b(res) 函数或promiseFromA.then(res => { // ... Your promise callback code }); 中操作此数据。

Answer 2

函数 b 中使用的 setTimeout 不是一个承诺。我很快就会找到一些文档来站点和发布，但这是我看到的。

要使用promise，您需要调用promise 方法，setTimeout 不是promise。这只是一个延迟。它与 javascript 或 javascript 运行时中的事件循环有关，以便更正确。这里有一些好东西 --> https://github.com/getify/You-Dont-Know-JS/tree/master/async%20%26%20performance

也 .then 仅用于解决承诺

getify 确实打破了它，但我会从 javascript 事件循环开始