【转载】防抖和节流

防抖和节流-是针对响应跟不上触发频率这类问题的两种解决方案


debounce,去抖动。策略是当事件被触发时,设定一个周期延迟执行动作,若期间又被触发,则重新设定周期,直到周期结束,执行动作。

debounce的特点是当事件快速连续不断触发时,动作只会执行一次。 延迟debounce,是在周期结束时执行。但当触发有间断,且间断大于我们设定的时间间隔时,动作就会有多次执行。

//必须在动作停止后计时算再执行,防抖类似于事件结束回调

debounce

继续思考,使用上面的防抖方案来处理问题的结果是: 如果在限定时间段内,不断触发滚动事件(比如某个用户闲着无聊,按住滚动不断的拖来拖去),只要不停止触发,理论上就永远不会输出当前距离顶部的距离。

throttle节流:节流与抖动不一样,节流是会说预先设定一个执行周期,当调用动作的时刻大于等于执行周期则执行该动作,然后进入下一个新周期。拿onscroll事件来说,如果使用的是抖动的话,只用当滚动停止后才会执行回调函数,在滚动的过程是不会执行的。节流不同,滚动的时候每隔一个时间周期就会执行一次回调,然后进入下一个新周期

原理:节流函数不管事件触发有多频繁,都会保证在规定时间内一定会执行一次真正的事件处理函数。

节流类似技能冷却时间

throttle
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值