>웹 프론트엔드 >JS 튜토리얼 >스로틀 밸브 및 디바운싱의 기본 구현 방법 소개

스로틀 밸브 및 디바운싱의 기본 구현 방법 소개

不言
不言앞으로
2019-04-13 11:53:002235검색

이 글은 스로틀 밸브 및 디바운싱의 기본 구현 방법을 소개합니다. 필요한 친구들이 참고할 수 있기를 바랍니다.

스로틀 밸브 스로틀

트리거된 이벤트는 실시간이 아닌 주기적으로 실행됩니다. 물이 떨어지는 수도꼭지처럼.

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 // 不需要时释放内存
*/

Debounce debounce

엘리베이터 문과 같은 마지막 이벤트 이후 N밀리초 후에 트리거됩니다.

rreee

위 내용은 스로틀 밸브 및 디바운싱의 기본 구현 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 segmentfault.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제