どのように防振と節流を実現し、彼らの使用シーンは何ですか?

ブレ止め

手ブレを防ぎ、その名の通り、手ブレを防ぎ、一度のイベントを何度も誤認しないようにします.キーボードを叩くのは毎日触れる手ブレ防止操作です.
コンセプトを理解するには、コンセプトが適用されるシーンを理解する必要があります.JSの世界では、どんなブレ止めのシーンがありますか?

ログイン、メールなどのボタンは、ユーザーのクリックが速すぎることを避けるため、複数回の要求を送信するため、ブレ防止

が必要である.

ブラウザウィンドウのサイズを調整するのに時間がかかり、resizeの回数が頻繁すぎて計算が多すぎるため、一度に位置する必要があり、振れ防止

を使用した.

テキストエディタはリアルタイムで保存し、変更操作が1秒もない場合に保存コードを以下のように保存します.

function debounce (f, wait) {
  let timer
  return (...args) => {
    clearTimeout(timer)
    timer = setTimeout(() => {
      f(...args)
    }, wait)
  }
}

しぼり

節流、その名の通り、水の流量を制御します.イベントの発生頻度を1 sに1回、さらには1分に1回制御する.サービス側(server)およびゲートウェイ(gateway)制御のリミットフロー(Rate Limit)と同様である.

scrollイベント、1秒ごとに位置情報などを計算する

.

ブラウザはイベントを再生し、1秒ごとに進捗情報などを計算する

.

inputボックスはリアルタイムで検索して要求展示ドロップダウンリストを送信し、1秒おきに要求を送信(振れ防止も可能)コードは以下の通りであり、「スロットルロック」

が見られる.

function throttle (f, wait) {
  let timer
  return (...args) => {
    if (timer) { return }
    timer = setTimeout(() => {
      f(...args)
      timer = null
    }, wait)
  }
}

まとめ

ブレ防止:ブレ防止、単位時間以内にイベントトリガがリセットされ、イベントが誤傷によって複数回トリガされることを避ける.コード実装はクリアクリアタイムアウト

に重きを置く

スロットル:トラフィックを制御し、サーバ側の制限フローであるRate Limitの場合、単位時間に1回しかイベントがトリガーされません.コードは、ロック解除ロックtimer=timeoutに再ロックを実現する.timer=null