防抖技术



开发中，

和节流是两种常用的优化技术，用于限制函数的执行频率，提升页面性能。

（debounce）：指触发事件后在一定时间内函数只执行一次，如果在这段时间内又触发了该事件，则会重新计算函数执行时间。

常用于输入框搜索、页面滚动等频繁触发事件的场景。

实现代码如下：

 javascript function debounce(fn, delay) { let timer = null return function() { clearTimeout(timer) timer = setTimeout(() => { fn.apply(this, arguments) }, delay) } } 

节流（throttle）：指连续触发事件但是在一定时间内只执行一次函数。节流常用于页面的滚动、窗口的resize等连续触发事件的场景。

实现代码如下：

 javascript function throttle(fn, delay) { let timer = null return function() { if (!timer) { timer = setTimeout(() => { fn.apply(this, arguments) timer = null }, delay) } } } 

需要注意的是，

和节流的实现都使用了闭包来保存计时器变量，以及返回一个新的函数。在实际应用中，可以根据具体的需求来选择使用哪种优化技术。

版权声明：

本文来源网络，所有图片文章版权属于原作者，如有侵权，联系删除。

本文网址：https://www.mushiming.com/mjsbk/3294.html