関数の実行中にコールバックを停止する

Question

質問：以前に実行されたタスクを実行している間に関数がコールバックを無視して再起動しないようにすることはできますか？

私には2つの機能があります。 機能番号1は、自身にコールバックするsetTimeoutを使用してオーディオファイルをトリガーします。 Math.round(Math.random() * aStartMax) + aStartMin;を使用して、サウンドをある程度ランダムに発生させます。 機能＃2は、完了に一定の時間がかかるビジュアルアニメーションを実行します。現在、関数＃1によってサウンドがトリガされると、コールバックは関数＃2を実行し、ビジュアルアニメーションを実行します。問題は、機能＃1が、機能＃2のアニメーションが完了するのに要する周波数よりも高い周波数で音を発し、アニメーションがその開始点にジャンプする（それが不思議に見える）点にある。ファンクション＃1の実行頻度を低下させたくないので、ファンクション＃2がすでに実行中の場合に受け取るコールバックを無視したいだけです。これは可能ですか？そうすれば、サウンドはどんな周波数でも発音することができますが、ビジュアルアニメーションは現在動作していない場合にのみ実行されます。

// FUNCTION #1: Audio function 
(function loop() { 

    var rand = Math.round(Math.random() * aStartMax) + aStartMin; 

    setTimeout(function() { 
     playDuration = Math.floor((Math.random() * aPlayDurationMax) + aPlayDurationMin); 

     setTimeout(function() { 
      var sound = new Howl({ 
       src: [soundFileName], 
       autoplay: true, 
       loop: true, 
       volume: (Math.random() * 0.8) + aVolumeMin, 
       fade: 0 
      }); 

      var id2 = sound.play(); 
      sound.fade(0, 1, aFadeIn, id2) 
      { 
       do_the_thing($('.a')); // << callback for function #2 
      }; 

      setTimeout(function() { 
       sound.fade(1, 0, aFadeOut, id2); 
      }, playDuration); 

     }, aWaitToPlay); 

     loop(); // calls the audio function to execute again 
    }, rand); 
}()); 

// FUNCTION #2: Visual function 
function do_the_thing($elements) { 
    var delay = $elements.children().length * universalBoxTime; 
    setTimeout(function() { 
     $elements.makisu('toggle'); 
     $elements.makisu({ 
      selector: 'dd', 
      overlap: .7, 
      speed: 2 
     }); 
    }, 0); 
} 

私は以下のようなsetTimeoutで私の＃2機能を設定することができますことを読みました。しかし、私はそれが関数が新しいコールバックを無視/ドロップするのを許すとは思っていませんが、むしろ後で起動するように単純にそれらをキューに入れますか？

function yourfoo() { 
// code 
setTimeout(yourfoo, 3000); 
} 

setTimeout(yourfoo, 3000); 

Answer 1

関数（またはそのコールバック）がその情報をそれ自身に格納することによってまだ実行中かどうかを格納できます。私は、機能＃2が（？多分経過delay後）に行われ、正確際にわからないんだけど、ここでの例です：

function do_the_thing() { 

    if (do_the_thing.running) return; 
    do_the_thing.running = true; 

    // your code 

    setTimeout(() => do_the_thing.running = false, 1000); 

} 

do_the_thingで実際の関数本体が1秒に1回の最大を実行ので、これはそれを作るだろう。理想的には、do_the_thingが実際に実行されたときにdo_the_thing.running = falseと設定します。

Answer 2

実行中のコールバック関数2の状態を変数に保存します。そうであれば、実行しないでください。そうでない場合は実行します。以下の擬似コードを確認してください

var isRunning = false; 

if(!isRunning) { 
    // callback function 2 
} 

function callback2() { 
// execute it 
isRunning = false; 
}