ジッタとスロットル

先端の臭い弟の勉強は新しいです!(´๑•_•๑)
ブレ防止:イベントをトリガーした後、n秒以内に関数を1回だけ実行し、タイミングを再計算します.

function fn() {
                console.log(' ')
        }
        function fd(func,wait){
            var timeout;
            return function(){
                if(timeout){
                    clearTimeout(timeout);
                }
                let callnow=!timeout;
                timeout=setTimeout(()=>{
                    timeout=null;
                },wait)
                if(callnow){
                    func.call()
                }else{
                    console.log(wait/1000+' ')
                }
            }
        }
        var clk=document.getElementById('btn');
        clk.onclick=fd(fn,5000)

スロットル:一定時間に1回のみ実行

        function fn() {
                console.log(' ')
        }
        function fd(func,wait){
            var pre=0;
            return function(){
                let now=new Date();
                if(now-pre>wait){
                    func.call();
                    pre=now;
                }else{
                    console.log(' '+wait/1000+' ')
                }
            }
        }
        var clk=document.getElementById('btn');
        clk.onclick=fd(fn,5000)

小さなDemo携帯電話は認証コードを送信します

  <input type="text" name="num" autocomplete="on">
  <div id="send">
     
  </div>
  <script>
    function fn() {
      console.log(' ')
      let c = document.getElementById('send');
      var time = 10;
      var zzc = setInterval(() => {
        time--;
        if (time == 0) {
          clearInterval(zzc)
          c.innerHTML = ' '
        } else {
          c.innerHTML = ' ' + time;
        }
      }, 1000)
    }
    function fd(func, wait) {
      var pre = 0;
      return function () {
        let now = new Date();
        if (now - pre > wait) {
          func.call();
          pre = now;
        } else {
          console.log(' ' + wait / 1000 + ' ')
        }
      }
    }
    var c = document.getElementById('send');
    c.onclick = fd(fn, 10000)
  </script>

まとめ:閉パケット格納状態値を用いて実行したい関数を実行するか否かを判断する.個人理解閉パッケージ:まずjsには2つのタイプの数値があります.1つは、基本タイプキーと値がスタックに保存されて使用されるときに直接使用されます.もう1つのタイプは参照タイプです.彼のキーはスタックに保存された数値がスタックメモリに保存されています.アドレスを通じてメモリのスタックデータを指します.閉パケットは匿名関数を返すことで参照タイプのデータがスタックメモリに保存されます.消去しないとメモリが漏れるという問題もあります.また、匿名関数には外層を参照したデータがあり、外層のデータも常に存在するが、外層のデータは基本タイプであるにもかかわらず(基本タイプは使用済みで、誰も使用していないと回収される)、ここでも役割ドメインチェーンの知識点に関連している.