Introduction aux méthodes de mise en œuvre de base du papillon des gaz et de l'anti-rebond

Le contenu de cet article est une introduction aux méthodes de mise en œuvre de base du papillon des gaz et de l'anti-rebond. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Pot papillon des gaz

Les événements déclenchés sont exécutés périodiquement, et non en temps réel. Comme un robinet qui goutte.

function throttle (fn, delay) {
  // 利用闭包变量时效性
  let timeout
  let arg
  return function () {
    arg = arguments
    if (!timeout) {
      timeout = setTimeout(() => {
        fn.apply(this, arg)
        timeout = null
      }, delay)
    }
  }
}
// demo
/*
var test = throttle(function (a) {console.log(a)}, 1000)
test(1) // 不执行
test(2) // 不执行
test(3)
=> 3
test = null // 不需要时释放内存
*/

Anti-rebond

Déclenché N millisecondes après le dernier événement, comme une porte d'ascenseur.

function debounce (fn, delay){
  let timeout
  return function(){
    const args = arguments
    clearTimeout(timeout)
    timeout = setTimeout(() => {
      fn.apply(this, args)
    }, delay)
  }
}
// 用法同throttle

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!