本文主要是介绍js 手写防抖、节流函数，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
防抖
在第一次触发事件时，不立即执行函数，而是给出一个期限值，比如200ms
- 如果在200ms内没有再次触发滚动事件，那么就执行函
- 如果在200ms内再次触发滚动事件，那么当前的计时取消，重新开始计时
function debounce(fn,delay){let timer = nullreturn function() {if(timer){clearTimeout(timer) //进入该分支语句，说明当前正在一个计时过程中，并且又触发了相同事件。所以要取消当前的计时，重新开始计时}timer = setTimeout(fn,delay) // 计时}
}
节流
连续触发事件但是在 n 秒中只执行一次函数，节流会稀释函数的执行频率。
方法一：该实现方式是通过使用setTimeout实现的，所以第一次不会立即调用回调函数。
function throttle(fn,delay){let valid = truereturn function() {if(!valid){//休息时间 暂不接客return false }// 工作时间，执行函数并且在间隔期内把状态位设为无效valid = falsesetTimeout(() => {fn()valid = true;}, delay)}
}
方法二：使用时间戳的形式实现节流函数，一旦触发该方法，回调函数会立即先调用一次。
function throttle(fn, delay) => {let pre = 0;return function(){let cur = new Date();if(cur - pre > delay){fn();pre = new Date(); } }
}
这篇关于js 手写防抖、节流函数的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
