Question

我刚开始在网络环境中使用JavaScript而且我还不能完全围绕回调函数，但我认为在我目前的情况下我需要一个（或更多？）。

我有两个函数需要反复以交替顺序运行，直到满足某个条件（条件本身依赖于function2以某种方式更改全局变量，不确定是否相关）。

所以最初我试过这个：

while(condition !== true) {
  function1();
  function2();
}

但是，这不起作用，因为两个（！）函数都使用setInterval函数来处理每个动画，因此while循环执行速度太快而不等待函数完成。现在我了解到我认为我需要在函数中使用回调函数。但是，由于function2()需要等待function1()并且function1()需要在此之后等待function2()，因此我认为我不太了解如何使用回调这需要某种无限的回调链。

如果这对于伪代码有帮助，那么整个设置就像这样（让我们假设它等待全局变量达到某个索引）：

var myGlobalCounter = 0;

while(myGlobalCounter < 8) {
  doSomeStuff(400);
  doSomeMoreStuff(400);
}


function doSomeStuff(targetCount) {
  // first function that needs setInterval
  var localCount = 0;

  myInterval = setInterval(function(){
    if (localCount !== targetCount) {
        count += 1;
        // animation happening here
    } else {
      clearInterval(myInterval);
    }
  },20);
}

function doSomeOtherStuff(targetCount) {
  // second function that needs setInterval and alters the global counter
  var localCount = 0;

  myInterval = setInterval(function(){
    if (localCount !== targetCount) {
        localCount += 1;
        // another animation happening here
        myGlobalCounter += 1;
    } else {
      clearInterval(myInterval);
    }
  },20);
}

如何修复此设置？请记住，我是一个非常初学者，我想在纯JavaScript中使用解决方案，因为到目前为止，我已经设法避免了jQuery用于项目的其余部分，并且对在while循环中使用回调的基础逻辑感兴趣。 / p>

Answer 1

根据条件交替使用两个函数。您可以将条件和函数相互传递。

function function1(condition, otherFunction) {
    // code
    if(!condition) otherFunction(condition, function1);
}

function function2(condition, otherFunction) {
    // code
    if(!condition) otherFunction(condition, function2);
}

如何在while循环中处理交替的异步函数？

1 个答案: