节流阀和去抖动的基本实现
节流阀throttle
触发的事件以周期的形式去执行,而非实时。如滴水的水龙头。
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
事件最后一次触发的N毫秒后触发,如电梯门。
function debounce (fn, delay){ let timeout return function(){ const args = arguments clearTimeout(timeout) timeout = setTimeout(() => { fn.apply(this, args) }, delay) } } // 用法同throttle
原文地址:https://segmentfault.com/a/1190000018840094
相关推荐
-
计算3个地理坐标点之间的夹角 javascript/jquery
2019-8-15
-
如何在 JavaScript 中创建自定义排序方法 javascript/jquery
2020-5-27
-
Element中组件的使用 javascript/jquery
2020-6-16
-
javascript递归 javascript/jquery
2019-9-13
-
浅谈JS的数组遍历方法 javascript/jquery
2019-5-16
-
手机端实现fullPage——全屏滚动效果 javascript/jquery
2019-6-20
-
angular中ElementRef用法 javascript/jquery
2020-7-16
-
Flutter 常用ListView和RefreshIndicator组件实现列表页面的上拉加载更多下拉刷新 javascript/jquery
2020-6-27
-
JavaScript 相关的工具代码 javascript/jquery
2019-5-14
-
编写可维护的 JavaScript 代码 — 编程风格,编程实践 读书笔记 javascript/jquery
2020-5-26