Javascript: Как предотвратить следующую строку, выполненную до тех пор, пока цикл SetInterval не станет clearinterval?

Question

Недавно я работаю над проектом, который использует SetInterval и SetTimeout

Вот простой код: (Примечание: functionB, functionC связаны с запросами JQuery AJAX)

function functionB() { 
     jQuery.ajax({ 
     type: 'POST', 
     url: 'https://MYHOSTNAME', 
     headers: { 
      'Content-Type': 'XXX', 
      'Accept': 'XXX' 
     }, 
     data: MYDATA, 
     dataType: 'html', 
     success: function (data, status, xhr) { 
      var RESPONSEDATA = data; 
      //true if match my special string 
      var Compare = RESPONSEDATA.indexOf(MYSTRING) > -1; 
      if (Compare === true){ 
       //stop the loop 
       clearInterval(loop1); 
      } 
     } 
     }); 
    } 


    function Main(){ 

     functionA();//can be anything 

     var loop1 = setInterval(function() { 
     setTimeout(functionB, 1000); 
     setTimeout(functionC, 1000); 
     }, 3000); 

     functionD();//can be anything 

     setTimeout(Main, 16000); 
    } 
    main(); 

Я пытаюсь убедитесь, что функцияD будет выполняться только после того, как loop1 завершится с clearInterval, он не может быть выполнен, когда функция B и functionC все еще находятся в цикле, и только когда функция D выполняется, функция Main будет ждать 16000 мс и снова перезапустить.

Я пробовал много способов с setInterval и setTimeout, но не повезло. Любой эксперт javascript знает, как это сделать?

Answer 1

Когда вы хотите:

1. работает functionA()
2. работает functionB() и functionC() параллельно каждые 4 секунды
3. при остановке работы functionB() и functionC(), а затем запустить functionD когда
4. когда functionD закончена Run Main() с задержкой 16 секунд

Добавить живой чек на петле

var loop1; 

function functionB() { 
    jQuery.ajax({ 
    type: 'POST', 
    url: 'https://MYHOSTNAME', 
    headers: { 
     'Content-Type': 'XXX', 
     'Accept': 'XXX' 
    }, 
    data: MYDATA, 
    dataType: 'html', 
    success: function (data, status, xhr) { 
     var RESPONSEDATA = data; 
     //true if match my special string 
     var Compare = RESPONSEDATA.indexOf(MYSTRING) > -1; 
     if (Compare === true){ 
      //stop the loop 
      clearInterval(loop1); 
      loop1 = false; 
     } 
    } 
    }); 
} 

function aliveCheckOfLoop(){ 
    if(loop1){ 
    addTimeout(aliveCheckOfLoop, 500); 
    }else{ 
    functionD();//can be anything 
    setTimeout(Main, 16000); 
    } 
} 

function Main(){ 

    functionA();//can be anything 

    loop1 = setInterval(function() { 
    setTimeout(functionB, 1000); 
    setTimeout(functionC, 1000); 
    }, 3000); 

    aliveCheckOfLoop(); 
} 

main(); 

Answer 2

Другой подход заключается в разделении основной функции на части и вызове второй части после очистки цикла.

var loop1; 

function functionB() { 
    jQuery.ajax({ 
    type: 'POST', 
    url: 'https://MYHOSTNAME', 
    headers: { 
     'Content-Type': 'XXX', 
     'Accept': 'XXX' 
    }, 
    data: MYDATA, 
    dataType: 'html', 
    success: function (data, status, xhr) { 
     var RESPONSEDATA = data; 
     //true if match my special string 
     var Compare = RESPONSEDATA.indexOf(MYSTRING) > -1; 
     if (Compare === true){ 
      //stop the loop 
      clearInterval(loop1); 
      goOn(); 
     } 
    } 
    }); 
} 

function goOn(){ 
    functionD();//can be anything 
    setTimeout(Main, 16000); 
} 

function Main(){ 
    functionA();//can be anything 

    loop1 = setInterval(function() { 
    setTimeout(functionB, 1000); 
    setTimeout(functionC, 1000); 
    }, 3000); 
} 
main();