定时器和函数防抖节流
2018-12-08 本文已影响10人
向布谷鸟说早安
定时器:
在javascript高级程序设计里面有讲到,重复的定时器(setInterval)会有一些问题:(Javascript高级程序设计第三版:611页)
1.某些定时器会被跳过
2.定时器之间的间隔会比预期的时间要短
原因在于定义定时器所在的主函数运行时间过长,所以在选用定时器的时候,尽量不要选用setInterval,可以使用setTimeout连续设置,或者也可以每次都清除当前setInterval的定时器,重新设定新的定时器(有点绕)。
函数防抖:(Javascript高级程序设计里也有描述,不过书中概念是节流)
防抖的原理就是:你尽管触发事件,但是我一定在事件触发 n 秒后才执行,如果你在一个事件触发的 n 秒内又触发了这个事件,那我就以新的事件的时间为准,n 秒后才执行,总之,就是要等你触发完事件 n 秒内不再触发事件,我才执行,真是任性呐!(JavaScript专题之跟着underscore学防抖)
总结成一句话就是:
n s内最后一次触发这个事件的用户操作才使有效的。
适合多次事件一次响应的情况
应用场景:
给按钮加函数防抖防止表单多次提交。
对于输入框连续输入进行AJAX验证时,用函数防抖能有效减少请求次数。
判断scroll是否滑到底部,滚动事件+函数防抖
未完待续